Problem using npm and webpack

[Josema]

When building with webpack I have this issue:

Just this line in my code: import Instascan from 'instascan'

ERROR in ./node_modules/instascan/src/zxing.js
Module not found: Error: Can't resolve 'fs' in '/Users/enzo/Copy/projects/elevenyellow/coinfy/node_modules/instascan/src'
resolve 'fs' in '/Users/enzo/Copy/projects/elevenyellow/coinfy/node_modules/instascan/src'
  Parsed request is a module
  using description file: /Users/enzo/Copy/projects/elevenyellow/coinfy/node_modules/instascan/package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: /Users/enzo/Copy/projects/elevenyellow/coinfy/node_modules/instascan/package.json (relative path: ./src)
    resolve as module

This is the setup I'm using: https://github.com/Josema/preact-webpack-hmr

[labregowski]

Hi. Did you solve it?

[Gavsum]

Adding the following to webpack.config "fixes the issue",

node: { fs: "empty" }

Found here: https://github.com/webpack-contrib/css-loader/issues/447

[firestar300]

For Webpack 5, use :

  resolve: {
    fallback: {
      fs: false,
    },
  },

https://webpack.js.org/migrate/5/