0

Fresh JS dev here, completely new to modern day Javascript, modules, etc. Have no idea what I'm doing. I was tasked with creating a tech-stack for a new web client that uses React. Started an app with npx create-react-app. Was working just fin when all of a sudden I get the following errors when I saved a change to one of my components. All I did was add a paragraph tag.

ERROR in ./node_modules/sass-loader/dist/index.js 7:34-48

Module not found: Error: Can't resolve 'url' in 'C:\Development\Repos\Node\se\client\node_modules\sass-loader\dist'

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: { "url": require.resolve("url/") }'
    - install 'url'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "url": false }


ERROR in ./node_modules/sass-loader/dist/index.js 8:35-50

Module not found: Error: Can't resolve 'path' in 'C:\Development\Repos\Node\se\client\node_modules\sass-loader\dist'

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 }


ERROR in ./node_modules/sass-loader/dist/utils.js 14:34-48

Module not found: Error: Can't resolve 'url' in 'C:\Development\Repos\Node\se\client\node_modules\sass-loader\dist'

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: { "url": require.resolve("url/") }'
    - install 'url'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "url": false }


ERROR in ./node_modules/sass-loader/dist/utils.js 15:35-50

Module not found: Error: Can't resolve 'path' in 'C:\Development\Repos\Node\se\client\node_modules\sass-loader\dist'

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 }


ERROR in ./node_modules/sass/sass.dart.js 116:14-29

Module not found: Error: Can't resolve 'util' in 'C:\Development\Repos\Node\se\client\node_modules\sass'

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: { "util": require.resolve("util/") }'
    - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "util": false }


ERROR in ./node_modules/sass/sass.dart.js 118:12-25

Module not found: Error: Can't resolve 'fs' in 'C:\Development\Repos\Node\se\client\node_modules\sass'

I have no idea what to do here. I've been down a rabit hole of answers across Google and stack overflow, none of which have helped.

I've tried this, and this, and this. I'm grasping at straws now...I have no idea what polyfills are. Pretend an entry level JS developer is given the task of creating a full fledged enterpris React app in a month. Because thats exactly what happened, and we have no React devs on any of our teams.

Jason Ayer
  • 621
  • 1
  • 10
  • 20
  • Probably related [github issue](https://github.com/facebook/create-react-app/issues/11756) – Sergey Sosunov Jan 26 '23 at 16:47
  • @SergeySosunov so basically my options are A) Find polyfills for the modules I need or B) drop those modules? – Jason Ayer Jan 30 '23 at 19:26
  • Im not recommending anything, just because I had no errors like this one so I have no idea what will work, but, there is also 3rd option as I can see, get rid of CRA, I found an interesting and pretty hot [PR](https://github.com/reactjs/reactjs.org/pull/5487) recently. – Sergey Sosunov Jan 30 '23 at 19:47

0 Answers0