Error: Invalid hook call,이라는 에러가 나오는대요

[인천사는사람]

에러가 나오는걸 확인한건 

styled-components를 이용한 class 없는 css 스타일링 제작 영상을 보며 하다가 확인하였습니다.

src/index.js에 ReactDOM.render( 이부분에서 문제가 있다고 나오는거같은대

index.js파일에서 코드 지워보고 확인하고 해도 어느 부분이 문제인지 못찾겠습니다;

index.js의 코드는 현재 이렇게 작성되어있습니다.

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import {BrowserRouter} from 'react-router-dom';

ReactDOM.render(
<React.StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</React.StrictMode>,
document.getElementById('root')
);

// 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();

그리고 리엑트가 보여준 에러메세지는 다음과 같습니다.

에러 페이지가 2개가 나오는대 2개다 동일한 경로가 문제라고 나옵니다

[codingapple]

index.js 파일말고 방금 수정한 부분이 문제인듯합니다

그 부분 코드를 올려주십시오

[인천사는사람]

안녕하세요 index.js 제외하고 주로 작성하던 app.js와 detail.js의 코드는 다음과 같습니다.

(detail.js)

app.js

이 파일들 외에는 크게 건드린 파일은 최근에 없습니다.

[codingapple]

<Echo 신발={신발=[t]} 이게 이상해보입니다 

<Echo 신발={t}만 써봅시다 

[인천사는사람]

안녕하세요

지적하신부분을 수정하고 구글링해서 유사사례를 참고하여 수정하였으나 에러가 사라지지 않아서 다른 프로젝트 폴더를 만들어서 다시 part2를 시작하였는대

react-bootstrap와 관련된걸 import하는 과정에서 다시 동일한 에러가 출력해서 위의 파일도 그게 문제인거로 생각됩니다.

새로운 프로젝트 폴더에서 이부분을 작성한뒤 동일한 에러가 발생한거를 확인했습니다.

index.html에도 bootstrap와 관련한 내용을 작성하였습니다.

그런대 지금 생성한 프로젝트 폴더나 위에서 사용하던거나 package.json에는 bootstrap관련한 내용이 안보이는대 혹시 이게 원인일까요?

[codingapple]

새로운 프로젝트에도 react-bootstrap 설치명령어로 설치하도록 합시다

index.html에 복붙할 때 4버전으로 찾아서 복붙하는게 좋을듯 합니다 

[인천사는사람]

해결했습니다.

새프로젝트 폴더 만들어서

npm 대신 yarn 사용해서 bootstrap설치하니 일단 에러문제가 해결되었습니다.

감사합니다.

[글쓴이]

글