[해결방법] 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.

이틀간의 시행착오로 해결하게 된 방법...

📌 1. react-scripts 버전

scripts 버전을 다운그레이하는 것이다.

npm i react-scripts@4.0.2

이게 가장 간단한 방법임

📌 2. eject 하기

webpack.config.js 파일을 만든 후에 필요한 모듈들을 설치하고 입력했음

module.exports = {
	resolve: {
    	fallback: {
        https: require.resolve('https-browserify'),
        querystring: require.resolve('querystring-es3'),
        url: require.resolve('url/'),
        os: require.resolve('os-browserify/browser'),
        path: require.resolve('path-browserify'),
        stream: require.resolve('stream-browserify'),
        crypto: require.resolve('crypto-browserify'),
        util: require.resolve('util/'),
        assert: require.resolve('assert/'),
        http: require.resolve('stream-http'),
        child_process: false,
        fs: false,
        net: false,
        tls: false,
      },
	}
}

그런데 인식을 못하는건지 오류는 해결되지 않았고

npm run eject

eject한 후 config 폴더 속 webpack.config.js 파일에 저걸 추가함

📌 eject 후 모든 파일 첫 줄에 빨간 줄이 생길 때

package.json 내부 eslintConfig 속성에 아래 설정을 통해 해결

"eslintConfig": {
    "env.": {
      "NODE_ENV": "development"
    }
    // more ...
}

참고 링크 : https://github.com/velopert/learning-react/issues/348