본문 바로가기

전체 글

 (380)
[webpack-cli] Unable load 'C:\FrequentlyUsedFiles\MyProject\workoutFront\webpack.config.ts'[webpack-cli] Unable to use specified module loaders for ".ts". [webpack-cli] Unable load 'C:\FrequentlyUsedFiles\MyProject\workoutFront\webpack.config.ts'[webpack-cli] Unable to use specified module loaders for ".ts". webpack이 webpack.config.js를 인식하지 못할때 생기는 애러!!! webpack은 기본적으로 TS(타입스크립트)를 인식하지 못함 tsconfig.json 에 다음 설정을 추가하여 인식하게 해야한다.
Critical dependency: the request of a dependency is an expression "문제 해결의 순서는 항상 에러를 예의주시하는 것에서 시작하지만 예외가 너무 범용적인 예외로 뜨거나 당체 무슨 뜻인지 알수 없는 애러인 경우의 해결책은 내가 가장 마지막으로 성공적으로 실행한 버전과 비교해 보는 것이다!!!"Critical dependency: the request of a dependency is an expression  라고?? 한국어로 바꾸어 말하면 "심각한 종속성: 종속성 요청이 표현식입니다." 이 에러가 나올당시에 내 코드는 아래와 같았다(실전적으로 말하면 아래 부분의 코드가 문제인 것인지도 인지 하지 못했지만). 도대체 내 코드의 어떤 부분이 문제인지 알려주지를 제대로 알려주지를 않아 어디가 오류를 내는 코드인지 몰랐던 것이다(적지 않은 경우는 당연히 어디가 문제라고 명확히 ..
메인 화면의 Cannot GET / 에러 결과부터 말하자면 웹팩설정파일인 webpack.config.js와 index.html파일이 같은 디렉토리 아래 있지 않아서 생긴 문제였다. 즉, npx webpack serve라는 명령어를 터미널에 입력하면 webpack.config.js파일부터 찾아서 실행하고 그 다음에 index.html파일을 찾는다. 여기서 index.html을 기본적으로는 webpack.config.js과 같은 디렉토리에서 찾는다. 찾아보고 없으면 에러를 위와 같은 에러를 발생시키는 것이다.(그리고 webpack.config.js 파일에서는 index.html파일이나 index.html에서 언급된 파일을 어느 디렉토리에서 찾을지 마저 설정해 줄수 있는 기능이 있다. webpack공식문서 참고하면 나온다. 물론 검색어는 잘 설정해서..
react_WEBPACK_IMPORTTTED_MODULE_0_.useContext(...) 에러 메인 화면에 나온 에러를 구글링해도 원인을 찾을 수 없었다. 한동안 이것때문에 시간을 보냈다. 그런데 다 필요없고 그냥 504라는 것만 보고 서버측에 문제가 있다는 것을 인지하는 것이 가장 중요하다. 오랜만에 손대는 프로젝트이다 보니 단지 서버의 영향 없이 프론트만 가지고 돌아가는 프로그램으로 오해하고 프론트만 가지고 낑낑 거리다보면 해결될 줄 알았다. 내가 임시로 만들어놓은 8085번 포트의 서버를 켜고 해보니 문제가 그냥 순식간에 해결되었다.
로컬에 대응하는 원격 브랜치, HEADER에 대하여 https://www.youtube.com/watch?v=6WDDeSDZcwM   (Header, Branch, commit간의 관계를 설명한 영상)https://yohda.tistory.com/entry/GIT-%EB%AA%85%EB%A0%B9%EC%96%B4%EC%9E%91%EC%84%B1%EC%A4%91  (정말 유익한 글)  요약: A라는 브랜치에 checkout한 상태에서 새로운 B라는 브랜치를 만들었다. 이렇게 되면 B브랜치에는 A브랜치가 가지고 있는 파일상태가 그대로 전달된다. A라는 브랜치에 checkout한 상태에서 새로운 B라는 브랜치를 만들었다. 이렇게 되면 B브랜치에는 A브랜치가 가지고 있는 파일상태가 그대로 전달된다. 그것을 증명하는 내용이 위 비디오에도 나오지만 아래의 내용에서 ..
post http://localhost:3000/()%20=%3E%20%60$%7BDOMAIN%7D/api/v1%60/auth/sign-up API관련 이슈로 아래 코드와 같이 회원가입을(Sign up) 할때 axios를 사용해서 경로를 아래와 같이 나름 정확하게 전달해 주었다.  그런데도 개발자 도구에는 아래 그림과 같이 엉뚱한 경로로 POST되었다고 나타나면서 404NOT FOUND 에러를 발생시켰다. 코드에서 보는것과 같이 경로를 정확하게 주었는데도 이와 같은 에러가 나타나는 이유가 무엇일까?서버 포트가 4000번인데 3000번 오류 난 것도 의아했다.답:  정확히 서버(4000)로 post를 날리는데 3000번이라고 오류가 난다? 이렇게 되면 그냥 프론트측 코드에서 뭔가 문제가 있는 것이라고 보면 된다(중요). 그러니 3000번 이라고 뜨는 것이다. 실제로 함수인데도 ( ) 를 빼먹어서 발생한 오류였다.API_DOMAIN을 API_DO..
서버의 프롬프트에 출력되는 고정된(Default)에러를 내가 관리하는 에러로 바꾸기 로그인시 암호 또는 페스워드에 아무 것도 입력하지 않을시 서버측에서 이러한 잘못된 리퀘스트를 받았을때 내뱉는 에러가 있다. 그 에러는 다음과 같으며 여기서는MethodArgumentNotValidException라고 나오는 경우이다. 이러한 경우 웹 브라우저의 개발자 도구에는 전형적인 예외인 Bad Request에러가 나오게 된다.이러한 전형적인 예외가 아닌 내가 이미 지정한 예외를 반환시키기 위해서 아래와 같이 예외를 따로 처리하는 폴더를 만들고(exception)그 안에 클래스를 하나 만들고(BadRequestExceptionHandler) 그 클래스에  @RestControllerAdvice, @ExceptionHandler 와 같은 어노테이션을 추가 해준다. IDE에 뜬 에러와 같은 MethodA..
react-cookie 사용하기 작품을 진행하던 중 사용자 정보를 다른 페이지에서 활용할 일들이 생겨 방법을 고민해봤다.우선 기존에는 Redux를 이용하여 사용자가 로그인을 완료하면 Redux에 저장한 후 그 데이터를 활용하려 했다.그러나, 이 방법의 심각한 문제점은 새로고침을 하면 Redux의 정보가 모두 날아간다는 것이었다.따라서 사용자 정보를 로컬 브라우저에 담아야 했고, 쿠키를 생성하여 사용하기로 했다쿠키를 다음과 같이 알고있다.웹 서버가 브라우저에게 보내어 저장했다가 서버의 부가적인 요청이 있을 때 다시 서버로 보내주는 문자열 정보웹페이지 방문 시 방문 기록 등 브라우저의 정보들이 저장된 텍스트 파일 하지만 쿠키에는 토큰에 관한 정보를 넣을 수도 있다. 즉 토큰을 쿠키처럼 사용할 수 있는 것이다. cookie를 설정 및 사용하..

티스토리툴바