오늘의 Error가 아니다 걍 이번주의 Error다 너무많다

길고 꾸준하게·2022년 4월 13일
0


뭐이리 많을까? 사람이 문제가 있어서 그런가부다ㅎ;ㅎㅎㅎㅎ;ㅎ;ㅎ;;ㅎ (사실 노트에 박아놓고 블로깅을 미룸)

npm install시 생기는 종속성 문제

뭔자꾸 install만하면 "unable to resolve dependency tree" 에러가떠서 npm이

--legacy-peer-deps 아니면 --force 로 설치해라 라고했다.

구버전의 npm은 종속성 문제가생겨도 일단 설치하고봤는데 신버전부터는 문제가 생기면 설치를 안하나부다.

그래서 종속성 문제를

--force는 우회해서 설치하는것이고. --legacy-peer-deps는 무시하고 설치하는 것 같다.

우회설치는 남자답지않으니 일단 후자를 선택해서 진행했다

https://velog.io/@yonyas/Fix-the-upstream-dependency-conflict-installing-NPM-packages-%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0%EA%B8%B0

참조했다.. 너무좋은글

=> 당연한걸수도 있는데 npm이 아닌 yarn으로 설치하면 종속성문제가 있어도 일단 설치하고봐서 저 두개 키워드를 안 붙여도 된다는건 일단 손이 편한것같다;;

react-create-app --template typescript error!

왜! 이게 제일화가났다 원래 잘되던게안되면 화가날만도하지,, 음,,
일단 겪은 문제는 .tsx확장자를 import를 못해오는것. 그래서 App.tsx도 못불러온다
=> 혹시나해서 .js로 바꾸니까 잘 불러와지고 렌더도 잘됬다.

그래.. 원인을 알았으니 검색을 했다.
https://stackoverflow.com/questions/43595555/webpack-cant-resolve-typescript-modules

나를 구원해줄 외국형님이 등장했다.

바로 webpack.config.js 안에 .tsx .ts 경로를 추가해주고자 해당 파일을 찾고있었는데 안보인다..
경로 역시 구글링을 해봤다

https://stackoverflow.com/questions/43595555/webpack-cant-resolve-typescript-modules
이역시도 외국형님께서 알려주셨다.. 나도 개념을 이해하고 누군가에게 도움을 주는 사람이 되야할텐데..
(아 일단 영어부터 해야겠지?)

띠용. 나의 webpack.config.js는 이미 .ts .tsx가 다 들어가있었다
진짜 어질어질했다.
모든걸 다포기할때쯤 'npm말고 yarn으로 create-react-app을 하면 다를까?' 라는 생각을 했고.

에러를 해결했다.. ㅎㅎ; 왜그러는지는 아직까지도 레이미스테리오..

component cannot be used as a JSX component

이 에러는 어지간하면 @types/패키지이름 을 설치해주면 다 해결됬는데 아니 안되는게 있었다.
열심히 구글링해서 스택오버플로우 외국형님이 주신 답을 써봤다.
(링크는 못찾았지만 그 형님의 말씀을 긁어왔다)
UPD: Just a bit detailed answer:
@types/react-dom has its own dependencies and one of them is @types/react with a version set to '*' - a major release, that now, probably, refers to 18.
Even if you specify some strict versions in your package.json (without ^) parent package might install its own duplicates of packages that you are already using for its own purposes.
By using resolutions we are specifying strict restrictions for dependencies of dependencies.

형님의 의도를 잘은 모르겠지만 온몸으로 흡수하고 package.json에 추가했다

"resolutions": {
  "@types/react": "17.0.2",
  "@types/react-dom": "17.0.2"
}

해결.. 외국형님과 번역기만 있으면 두려울게없다... 덕분에 해방됬다.

profile
작은 나의 개발 일기장

0개의 댓글