각종 설치Issue & Solution & Enlightenment (46) 썸네일형 리스트형 초간단 webpack, 라이브러리 관련 오류 해결법. node_modules doesn't exist, 아래와 같은 수많은 에러가 단번에 해결될 수도 있는 해결책은 --force이다. 즉 문제를 해결하기 위해 라이브러리를 설치하려고 하는데 라이브러리마저 설치가 되지 않는다면 강제로 라이브러리를 install하는 명령어인 --force를 활용하면 크게 도움을 받을수 있다. ex)npm install react-custom-scrollbars --force 설정관련 문제는 정말 그 투자하는 시간대비 얻을 수 있는게 랜덤이다. 내가 개발하면서 독창적으로 환경설정을 하는 일이 얼마나 있을까? 그냥 설정문제는 해결하면 그게 장땡인 것이다. no extension Field 'browser' doesn't contain a valid alias configuration C:\FrequentlyUsedFiles\sle.. source tree에서의 push declined due to repository rule violations 오류 처음 sourcetree를 이용해 보았다. 아래와 같은 오류가 나왔다(이전에 어떠한 오류가 있었긴 한데 기억이 나지 않았다). 나는 이 오류가 나기전에 그 오류를 해결하려고 personal access token을 받은적이 있는데 그 개인정보를 그냥 파일안에서 코드의 내용으로 포함시켰다. 놀라운게 commit을 한 후 push를 할라치면 git에서는 파일안테 태그로 감싼 비밀내용이 있음을 감지하고 push를 막는다는 것이다... 첫번째로 이 지경까지 온 이유는 오류를 정확히 읽지 않는 나쁜 습관 때문이다. 여기서 추가적으로 한가지 더 중요한 배울거리는 "이 커밋까지 현재 브랜치를 초기화"를 선택하면 아래와 같은 선택지창이 나오는 것을 볼수 있는데 여기서 hard를 선택하면 내가 마지막으로 코딩하여 커밋했.. 리엑트 이미지, 폰트 loader문제 해결 리엑트를 사용하여 나만의 프로젝트를 하는중 아래와 같은 에러를 만났다. ERROR in ./src/img/timeTable.jpg 1:4 Module parse failed: Unexpected character '�' (1:4) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders 요약하면 이미지를 사용하기위해서는 loader가 필요하다는 것이다. 어떻게 문제를 해결해야 할지 gpt에게 물어 보았고 그 결과는 아래와 같았다. 이에 따라 "리엑트 이미지 loader" 라.. 리엑트 이미지, 폰트 loader문제 해결 리엑트를 사용하여 나만의 프로젝트를 하는중 아래와 같은 에러를 만났다. ERROR in ./src/img/timeTable.jpg 1:4 Module parse failed: Unexpected character '�' (1:4) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders 요약하면 이미지를 사용하기위해서는 loader가 필요하다는 것이다. 어떻게 문제를 해결해야 할지 gpt에게 물어 보았고 그 결과는 아래와 같았다. 이에 따라 "리엑트 이미지 loader" 라.. React is not defined 에러 해결 참고: https://velog.io/@sooyun9600/React-is-not-defined-%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0 기존의 문서를 리엑트 형식으로 일일히 변환하는 과정에서 React is not defined라는 에러를 만났다. react 변환해주는 과정에서의 문제는 bable-loader에서 문제가 있다는 것을 의미한다는 것을 알게 되었다. 아래의 코드를 다음과 같이 변형하였더니 문제는 해결되었다. //문제의 코드 { test: /\.m?js$/, exclude: /(node_modules|bower_components)/, use : { loader: 'babel-loader', options:{ presets: [ "@babel/preset-env",.. 오류해결!) React에서의 npm install typescript에서 발생한 오류 아래와 같이 명령어로 npm install typescript 라고 명령하니 오류가 떳다. 검색결과 원인은 위의 두가지 해결방안을 모두 적용하여 기존의 package.json에 있는 react-custom-scrollbars을 삭제하고 https://www.npmjs.com/package/react-custom-scrollbars-2 으로 들어가 npm install react-custom-scrollbars-2 --save 을 터미널에 입력해 주어 해결하였다. 어떠한 라이브러리(여기서는 typescript)설치시 문제가 발생한다면 기존의 라이브러리와의 호환성 문제를 생각해 볼 필요가 있다. vscode launch.json 파일과 브라우저 안뜨는현상 react를 사용하여 정상적으로 프로젝트 빌드까지 했는데도 브라우저에서는 계속 뺑뺑이 표시만 돌고 있고 정상적으로 실행이 되지 않는 문제의 원인은 아래의 launch.json때문이다. 이 파일을 반드시 지워야 한다. 그렇지 않으면 정상적으로 실행이 되지 않는다. 아래와 같이 브라우저가 계속 뺑뺑이 표시만 돌고 있다면 반드시 위의 파일이 있는지 확인해야 한다. TailwindCSS설치방법 # TailwindCSS 설치방법 #npm #CDN 출처: https://www.youtube.com/watch?v=zun40BxCzYU&list=PLTb3qGCzYjS3DHl3q0Hlq8kRT5fd9aK5_&index=2 (위의 영상은 https://tailwindcss.com/docs/installation 여기에 있는 내용을 자세히 설명한 것이다. 여기서 주의할 점은 아무리 영상을 봐도 결국은 그것은 흔들리는 지식이다. 내가 굳건하게 설려면 공식문서를 해석하는 힘을 길러야 한다. 이 힘을 기르는 좋은 방법은 저런 친절한 영상과 문서를 비교해가면서 보고 어떤 내용이 공식문서에는 생략되어 있는가, 그리고 공식문서에서는 어떤 방식으로 설명하는가, 둘의 차이점을 비교하면서 공부하는 것이다) (복습. npm.. 이전 1 2 3 4 5 6 다음
