Module not found: Error: Can't resolve 'fs'

Everything was fine, my app had no issues at all until the New Year started (2022). It was then that Webpack began to fail and all these random errors that I had never dealt with before started to come in. I tried fixing the errors but more keep coming. I am not sure what to do. Anyone please assist.

Errors from my terminal below:

`Failed to compile.

Module not found: Error: Can’t resolve ‘fs’ in ‘/Users/shansiddiqui/Desktop/dash/node_modules/dotenv/lib’ asset static/js/bundle.js 2.31 MiB [emitted] (name: main) 1 related asset asset index.html 1.67 KiB [emitted] asset asset-manifest.json 190 bytes [emitted] runtime modules 28.2 KiB 13 modules modules by path ./node_modules/ 2.13 MiB 126 modules asset modules 4.4 KiB 16 modules modules by path ./src/ 18.3 KiB modules by path ./src/.css 8.82 KiB ./src/index.css 2.72 KiB [built] [code generated] ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css 1.37 KiB [built] [code generated] ./src/App.css 2.72 KiB [built] [code generated] ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/App.css 2 KiB [built] [code generated] modules by path ./src/.js 4.15 KiB ./src/index.js 1.51 KiB [built] [code generated] ./src/App.js 2.64 KiB [built] [code generated] modules by path ./src/components/weather/ 5.3 KiB ./src/components/weather/Weather.js 3.41 KiB [built] [code generated] ./src/components/weather/Form.jsx 1.89 KiB [built] [code generated]

ERROR in ./node_modules/dotenv/lib/main.js 24:11-24 Module not found: Error: Can’t resolve ‘fs’ in ‘/Users/shansiddiqui/Desktop/dash/node_modules/dotenv/lib’ @ ./src/components/weather/Weather.js 7:0-28 12:0-13 @ ./src/App.js 5:0-56 25:41-53 @ ./src/index.js 7:0-24 10:33-36

ERROR in ./node_modules/dotenv/lib/main.js 26:13-28 Module not found: Error: Can’t resolve ‘path’ in ‘/Users/shansiddiqui/Desktop/dash/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 } @ ./src/components/weather/Weather.js 7:0-28 12:0-13 @ ./src/App.js 5:0-56 25:41-53 @ ./src/index.js 7:0-24 10:33-36

ERROR in ./node_modules/dotenv/lib/main.js 28:11-24 Module not found: Error: Can’t resolve ‘os’ in ‘/Users/shansiddiqui/Desktop/dash/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: { “os”: require.resolve(“os-browserify/browser”) }’ - install ‘os-browserify’ If you don’t want to include a polyfill, you can use an empty module like this: resolve.fallback: { “os”: false } @ ./src/components/weather/Weather.js 7:0-28 12:0-13 @ ./src/App.js 5:0-56 25:41-53 @ ./src/index.js 7:0-24 10:33-36

3 errors have detailed information that is not shown. Use ‘stats.errorDetails: true’ resp. ‘–stats-error-details’ to show it.

webpack 5.65.0 compiled with 3 errors in 35396 ms `

[ovikariy]

I found out that for React app it is not needed to call the config as react-scripts already uses dotenv.

So I removed require(‘dotenv’).config() from my code and am able to access the environment variables without it.

See this answer for more details: https://stackoverflow.com/a/56668716/3394779

[ovikariy]

Same issue for me, I get 3 errors too for ‘fs’, ‘path’ and ‘os’