v5 used to include polyfills for node.js core modules by default
Created by: damozhang
Describe the bug
Compiled with problems
Did you try recovering your dependencies?
yarn --version
1.22.15
Which terms did you search for in User Guide?
react-scripts 5 webpack Module not found: Error: Can't resolve 'fs'
Environment
npx create-react-app --info
Environment Info:
current version of create-react-app: 5.0.0
running from /Users/xxx/.config/yarn/global/node_modules/create-react-app
System:
OS: macOS 12.0.1
CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz
Binaries:
Node: 16.13.0 - /usr/local/Cellar/node@16/16.13.0/bin/node
Yarn: 1.22.15 - /usr/local/bin/yarn
npm: 8.1.0 - /usr/local/Cellar/node@16/16.13.0/bin/npm
Browsers:
Chrome: 96.0.4664.93
Edge: Not Found
Firefox: 94.0.1
Safari: 15.1
npmPackages:
react: 17.0.2
react-dom: 17.0.2
react-scripts: 5.0.0
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
In a project with react-scripts v5.0.0
- yarn add -D dotenv
- yarn start
Expected behavior
Actual behavior
ERROR in ../../node_modules/dotenv/lib/main.js 24:11-24
Module not found: Error: Can't resolve 'fs' in '../node_modules/dotenv/lib'
@ ./src/config.ts 5:0-28 8:0-13
@ ./src/index.tsx 17:0-66 27:19-27 29:23-43 30:23-43 34:35-60
ERROR in ../../node_modules/dotenv/lib/main.js 26:13-28
Module not found: Error: Can't resolve 'path' in '../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/config.ts 5:0-28 8:0-13
@ ./src/index.tsx 17:0-66 27:19-27 29:23-43 30:23-43 34:35-60
ERROR in ../../node_modules/dotenv/lib/main.js 28:11-24
Module not found: Error: Can't resolve 'os' in '../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/config.ts 5:0-28 8:0-13
@ ./src/index.tsx 17:0-66 27:19-27 29:23-43 30:23-43 34:35-60
3 errors have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.
Some useful comments: