Webpack fs.readFileSync inside a node_modules dependency

Question

I'm bundling server-side code with a dependency on errorhandler, which itself fs.readFileSync's a css file. This isn't getting included in my bundle, and when I attempt to execute the bundle, it breaks immediately with a:

Error: ENOENT: no such file or directory, open '/public/style.css'

My goal is to bundle some server-side node, tree-shake it, and shove it into a docker container that I can simply execute. My repo setup and custom registries make it impractical to run npm install inside a docker container when building. Webpack seems like a solid strategy.

I found one suggestion that suggested adding this to my webpack config:

module.exports = {
  ...
  node: {
    __dirname: false,
    __filename: false,
  },
  ...
}

This did indeed change the error to

Error: ENOENT: no such file or directory, open '/Users/{me}/Projects/errorhandler-ts-webpack-err/dist/public/style.css'

Which seems moot. I've been looking for webpack loaders that will stringify in-line fs.readFileSync calls but I've not been successful yet.

Example repo here: https://github.com/TylerR909/errorhandler-ts-webpack-err/tree/no-typescript

I'm hoping to get this dependency and others like it building and running.

It seems like these answers are relevant: [How to copy static files to build directory with webpack](https://stackoverflow.com/questions/27639005/how-to-copy-static-files-to-build-directory-with-webpack). — jfriend00, Sep 05 '19 at 03:04
Those say nothing about a dependency calling `fs.readFileSync` to include that in the bundle, and throwing in a random `require('errorhandler/public/style.css`)` for every dependency that has an issue like this seems bad considering it has nothing to do directly with my code. Also that wouldn't necessarily link it correctly to the dependency that does expect to find a `public/style.css` file from an `fs.readFileSync` somewhere. — TylerR909, Sep 05 '19 at 17:46
That's because you can't call fs methods at all. You have to either use require or edit the config to bundle that file. The info you need is in there. — jfriend00, Sep 05 '19 at 19:29
I'm not the one calling `fs`, the node_module I'm loading is. I don't get to make that decision given that I'm not a maintainer of the errorhandler module. I'm stuck with either marking it external or deleting it from the project altogether. I've chosen the former for now. — TylerR909, Sep 06 '19 at 20:11

Kedar Bhawarthi · Answer 1 · 2022-02-20T02:08:54.040

I stumbled upon same problem for same package - errorhandler.

By setting all config values to true, and letting NodeStuffPlugin do its thing (to use polyfill) error changed to -

message: "uncaughtException: ENOENT: no such file or directory, open 'node_modules\errorhandler\public\style.css'\n" +

so setting following config

      node: {
        global: true,
        __filename: true,
        __dirname: true,
      },

AND copying nodemodule in dist directory helped to resolve this error

plugins: [
    new CopyPlugin({
      patterns: [
        // ........
        { from: './node_modules/errorhandler/**' },
      ],
    }),
  ],

I did not had more test cases to check validity of this fix though ENOENT error is gone.

Webpack fs.readFileSync inside a node_modules dependency

1 Answers1