Error: Cannot find file: 'index.js' does not match the corresponding name on disk: './node_modules/React/react' [closed]

Question

Here is an image of the error and the console error...

My code seems to be correct and the paths of the imports are good too, I don't understand why I'm getting this error.

Notifications.js

import React from 'React'

const Notifications = () => {
    return(
        <div>
            <p>Notifications</p>
        </div>
    )
}

export default Notifications

ProjectList.js

import React from 'React'

const ProjectList = () => {
    return(
        <div>
            <div className="project-list section">
                <div className="card z-depth-0 project-summary">
                    <div className="card-content grey-text darken-3">
                        <span className="card-title">Project Title</span>
                        <p>Posted by Net Ninja</p>
                        <p className="grey-text">3rd September, 2018</p>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default ProjectList

Answer 1

import React from 'React'

should be

import React from 'react'

You are trying to import React instead of react. The name of module is case-sensitive, in this case the name is react.

Answer 2

Notification.js

import React from 'react'

const Notifications = () => {
return(
    <div>
        <p>Notifications</p>
    </div>
)
}

 export default Notifications

ProjectList.js

 import React from 'react'

 const ProjectList = () => {
 return(
    <div>
        <div className="project-list section">
            <div className="card z-depth-0 project-summary">
                <div className="card-content grey-text darken-3">
                    <span className="card-title">Project Title</span>
                    <p>Posted by Net Ninja</p>
                    <p className="grey-text">3rd September, 2018</p>
                </div>
            </div>
        </div>
    </div>
)
}

export default ProjectList

module name is react not React and since imports are case-sensitive import React from 'React' is causing error

Answer 3

You can try this solution from Web-brackets.com
all you need to do is just rename the imported library from React to react with small r like this (on the first line)

import React from 'react';

reference https://web-brackets.com/discussion/6/-solved-cannot-find-file-index-js-does-not-match-the-corresponding-name-on-disk-react-js