반응형
dotenv를 사용할 일이 있어 서버에서와 같은 방식으로 dotenv를 설치하고 
사용하려는데 에러발생 
ERROR in ./node_modules/dotenv/lib/main.js 1:11-24

Module not found: Error: Can't resolve 'fs' in '/Users/user/Documents/projects/react/goback/node_modules/dotenv/lib'


ERROR in ./node_modules/dotenv/lib/main.js 3:13-28

Module not found: Error: Can't resolve 'path' in '/Users/user/Documents/projects/react/goback/node_modules/dotenv/lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }' - install 'path-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "path": false }

REACT_APP을 붙여야한다는 글을 보고 따라해봤는데도 그대로 였다 

REACT_APP을 안붙인게 이유였다면 dotenv를 불러오는데 에러가 나지는 않지... 

 

이유는 간단했다 

create-react-app으로 프로젝트를 생성하면 dotenv가 내장되어 있기 때문에 에러가 발생했던 것이었고

import했던 dotenv를 지우 package를 삭제하니 정상적으로 불러와진다 

반응형

'Front' 카테고리의 다른 글

[React] npm eject 되돌리기  (0) 2022.04.09

게시판 기능이 필요해서 만들던 중 

toast-ui와 ckeditor 둘 중 어떤걸로 할까 고민했다 

 

toast-ui를 적용하고 ckeditor도 적용해봤지만 후자가 조금 더 끌렸다 

원본을 사용하고 싶은 느낌... 

 

찾아보니 toast-ui dependency에 ckeditor가 존재하는 걸로 보아 ckeditor를 기반으로 라이브러리를 만든 듯 하다 

그래서 CKEditor를 적용하려 하는데 문제가 있었다 

 

뭔가.. 업데이트는 꾸준히 올라오지만 완성되지 않은 날것의 느낌? 

그래서 eject를 적용했고, webpack 파일을 수정하여 게시판을 만드는데 까지는 됬다 

하지만 고작 게시판하나 때문에 eject를 해야하나? 라는 생각이 들었고 

되돌리기 시작했다...

 

왜 eject 되돌리려하는가? 

우선은 CRA를 하게되면 스크립트를 제공하는데

이 스크립트로 인해 core한 부분은 신경쓰지 않아도 된다 

 

물론 고도화가 필요하다면 eject를 진행해야 하겠지만, 개발 초기단계부터 이런 리스크를 안고가고 싶지 않았다 

 

eject되돌리기 - 간단

1. eject를 하면서 생긴 디렉토리 정리 

2. node_modules 삭제 

3. package.json에 추가된 dependency 정리

4. react-script 설치 

5. package.json에 스크립트 추가 

 

eject되돌리기 

 

1.

우선 eject를 하면서 생긴 두개의 디렉토리 삭제 

src
  ㄴ scripts/
  ㄴ config/

 

2 ~ 3.

eject를 진행한 뒤 node_modules를 보면 CRA를 했을때는 보지못했던 babel관련 패키지들이 굉장히 많이 설치되어있다 

package.json > dependency에 새롭게 추가된 패키지들을 지우고, node_module도 지워준다 

 

4.

package 재설치

react-scripts패키지 설치 

npm i
npm i react-scripts

 

5.

package.json에 스크립트를 다시 추가해준다 

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

 

이렇게 하면 되돌려진다

 

하지만 가장 좋은 방법은 역시 새로운 브랜치에서 작업하기 

 

늘 새로운걸 적용하거나 추가한다면 기존의 develop, main 브랜치가 아닌

feature 브랜치를 따서 적용하도록 하자 

 

반응형

'Front' 카테고리의 다른 글

[React] dotenv에러  (0) 2022.04.12

+ Recent posts