BKJang / dev-tips

📚 This repository is a collection of development tips and troubleshooting I have experienced during development.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Uncaught ReferenceError: process is not defined

BKJang opened this issue · comments

❓ What is the cause of this issue?

  • react-error-overlay(react-scripts의 dependency)의 결과로, 이 패키지의 종속성이 webpack v5를 지원하도록 업데이트

🔨 What have I tried? How did you finally solve it?

  • 첫 번째 방법, update react-scripts v5
npm install react-scripts@latest
# or
yarn upgrade --latest react-scripts

하지만 webpack 버전 5이상은 폴리필을 수동으로 구성해야하기 때문에 아래와 같은 에러가 발생할 수 있다.

[Webpack] BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default

  • 두 번째 방법, Install react-error-overlay
npm i -D react-error-overlay@6.0.9
# or
yarn add -D react-error-overlay@6.0.9
  • 세 번째 방법, craco webpack plugin 설정
{
  ...
  webpack: {
    plugins: {
      add: [
        new webpack.DefinePlugin({
          process: {env: {}}
        })
      ]
    }
  }
}

🙏 Reference