Can't resolve 'fs' in .../...node_modules\pdfkit\js' - webpack loader issue

My webpack.config.js looks like this:

module.exports = {
    // devtool: 'source-map',
    entry: './src/app.js',
    output: {
        path: path.resolve (__dirname, "dist"),
        filename: "bundle.js"
    },
    module : {
        rules : [
            { test: /\.js$/, loader: 'babel-loader' },
            {
                test : /\.html$/,
                use : [ 'html-loader' ]
            }
        ]
    },
    plugins:
        [ new HtmlWebpackPlugin ({
              template : `src/app.html`
          })
        ]
};

In my app.js i have just this line: - nothing else. const PDFDocument = require ('pdfkit'); Which gives me the following errors:

ERROR in ./~/pdfkit/js/document.js
Module not found: Error: Can't resolve 'fs' in 'E:\0000 Path..\node_modules\pdfkit\js'
 @ ./~/pdfkit/js/document.js 26:7-20
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/app.js

ERROR in ./~/pdfkit/js/image.js
Module not found: Error: Can't resolve 'fs' in 'E:\0000 Path...\node_modules\pdfkit\js'
 @ ./~/pdfkit/js/image.js 11:7-20
 @ ./~/pdfkit/js/mixins/images.js
 @ ./~/pdfkit/js/document.js
 @ ./src/app.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/app.js

I can’t get this library working with webpack in any way. Please can you give me an example that uses webpack instead of broweseify?

[matdoering]

Does anyone know whether PDFKit is compatible with WebPack version 4? The previous solutions do not work anymore … I’m getting

Can't resolve 'fs'

for pdfkit/js/document.js, pdfkit/js/image.js, pdfkit/js/font/afm.js, png-js/png-node.js.

I have no clue what has changed from WebPack 3 to WebPack 4 … If anyone has got this working with WebPack 4.0, I’d very much appreciate it.

[huy-nguyen]

I ran into the same problem and adding these 2 loaders into webpack’s config solved the problem. Basically they make webpack run all pdfkit-related packages through browserify with the brfs transform (by invoking the transform-loader) and also inline the ./data.json file inside unicode-properties (one of pdfkit’s dependencies) (invoking the json-loader). Note that you also need to install the brfs module.

I didn’t have to set {node: {fs: 'empty'}}.

{
  module: {
    rules: [
      {
          test: /node_modules\/(pdfkit|fontkit|png-js|linebreak|unicode-properties|brotli)\//,
          loader: "transform-loader?brfs"
      },
      {
        test: /node_modules\/unicode-properties.*\.json$/,
        use: 'json-loader',
      },
    ]
  }
}