React Module not found: Error: Cannot find file: 'index.js' does not match the corresponding name on disk: '.\node_modules\React\react'.

Module not found: Error: Cannot find file: 'index.js' does not match the corresponding name on disk: '.\node_modules\React\react'.

 

 

 

Error로그 보시면 ./node_modules/React/reatc가 되었다. 먼저 index.js를 확인해봤으나 문제가 없다.

 

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

이럴때 다른 js파일의 모듈을 검사해봐야 한다.

나는 Counter.js라는 파일을 생성했으므로 

import React, {Component} from 'React';

class Counter extends Component{

    // constructor : 생성자
    // super: 부모의 생성자, 나의 부모다 있으면 부모의 객체를 먼저 생성
    constructor(props){
        super(props);

        this.state = {number : 0};
    }
    
    render(){
            //구조분해 할당
            const {number} = this.state; 
            return (
                <div>
                    <h1>{number}</h1>
             
                <button onClick={()=>{
                    this.setState({number : number + 1});
                }}> 
                
                + 1</button>
                </div>
            );
            }
}

export default Counter;

import React, {Component} from 'React';

 

React  import할때  import와 form의 react를 대소문자 구분을 확실하게 해애 한다.

import React, {Component} from 'react';