You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The transform-loader in webpack has been archived, and it looks like will not be updated for webpack 5. Is there a different approach to use to be able to use this in webpack 5?
Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[5].loader: transform-loader?brfs)
at RuleSetCompiler.error (/Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:365:10)
at /Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/UseEffectRulePlugin.js:160:29
at Hook.eval [as call] (eval at create (/Users/kelly/tock/admin/dashboard/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:41:1)
at RuleSetCompiler.compileRule (/Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:175:19)
at /Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:152:9
at Array.map (<anonymous>)
at RuleSetCompiler.compileRules (/Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:151:16)
at RuleSetCompiler.compileRule (/Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:182:30)
at /Users/kelly/tock/admin/dashboard/node_modules/webpack/lib/rules/RuleSetCompiler.js:152:9
at Array.map (<anonymous>)
error Command failed with exit code 1.
It has nothing to do with the original question. New syntax for rules I wrote, see above.
Migration guide from webpack 4 to webpack 5 is here: https://webpack.js.org/migrate/5/. Parameter --trace-deprecation will help a lot.
ok, while the above did get it compiling, running into further polyfill issues.
I polyfilled stream according to the helpful error messages:
Module not found: Error: Can't resolve 'stream' in '/Users/kelly/tock/admin/dashboard/node_modules/pdfkit/js'
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: { "stream": require.resolve("stream-browserify") }'
- install 'stream-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "stream": false }
then, it gives me this:
error in ./node_modules/stream-browserify/index.js
Module not found: Error: Can't resolve 'readable-stream/lib/internal/streams/end-of-stream.js' in '/Users/kelly/tock/admin/dashboard/node_modules/stream-browserify'
If you want to include a polyfill, you need to:
- add a fallback 'resolve.fallback: { "stream": require.resolve("stream-browserify") }'
- install 'stream-browserify'
This discussion is no longer much about pdfkit, for support with webpack use stackoverflow.com or something else.
Having similar issues. Have a working webpack 4 build with PDFKit. After upgrading to webpack 5, hitting a wall, even after adding polyfills like stream-browserify and buffer.
Builds fine, but getting the following error during runtime:
index.bundle.js:151906 Uncaught (in promise) TypeError: Cannot read property 'prototype' of undefined
at __extends (index.bundle.js:151906)
at index.bundle.js:151921
at Object.<anonymous> (index.bundle.js:152050)
at Object../node_modules/restructure/src/EncodeStream.js (index.bundle.js:152054)
at __webpack_require__ (index.bundle.js:202231)
at fn (index.bundle.js:202464)
at Object.<anonymous> (index.bundle.js:151449)
at Object../node_modules/restructure/index.js (index.bundle.js:151487)
at __webpack_require__ (index.bundle.js:202231)
at fn (index.bundle.js:202464)
Does anyone have a working webpack 5 configuration including polyfills and required modules that they could share?
Instead of providing a kitchen sink example, someone should provide a browser ready module. Seriously, why re-inventing the wheel in every project when a ready-to-use module would exist?
Activity
liborm85 commentedon Dec 28, 2020
There is no problem with the transform-loader. Works ok with webpack 5.
kelly-tock commentedon Dec 28, 2020
The query string syntax for loaders is deprecated, is there an example of using options object instead?
liborm85 commentedon Dec 28, 2020
Maybe. But this works without any error or warning or notice:
kelly-tock commentedon Dec 28, 2020
I get this error:
with this:
and:
liborm85 commentedon Dec 28, 2020
It has nothing to do with the original question. New syntax for rules I wrote, see above.
Migration guide from webpack 4 to webpack 5 is here: https://webpack.js.org/migrate/5/. Parameter
--trace-deprecationwill help a lot.kelly-tock commentedon Dec 28, 2020
Ah will try use instead then close if working
kelly-tock commentedon Dec 28, 2020
ok, I had dirty eyes on this one, this config was set up some time ago. weird that it works on loader inside of use but not on loader directly, but 🤷
the error message above was the result of running it with
--trace-deprecationjust as FYI.Thanks for your help on this, i'll try and get a small pr for
https://github.com/blikblum/pdfkit-webpack-example/blob/master/webpack.config.js
put together.
kelly-tock commentedon Dec 28, 2020
ok, while the above did get it compiling, running into further polyfill issues.
I polyfilled
streamaccording to the helpful error messages:then, it gives me this:
I try installing:
https://github.com/nodejs/readable-stream
then I do the same polyfill method, and it compiles, but I get:
which is discussed here:
nodejs/readable-stream#450
so i'm still a bit at a loss as to how to get this library working in webpack 5?
I tried aliasing process as suggested in the article on medium as well.
kelly-tock commentedon Dec 28, 2020
more context:
liborm85 commentedon Dec 29, 2020
Please read what webpack is writing to you:
This discussion is no longer much about pdfkit, for support with webpack use stackoverflow.com or something else.
kelly-tock commentedon Dec 29, 2020
Ok sounds good. I am reading and doing what webpack is telling me to do, just am hitting a bit of a dead end. Thanks for your help.
holitics commentedon Jan 4, 2021
Having similar issues. Have a working webpack 4 build with PDFKit. After upgrading to webpack 5, hitting a wall, even after adding polyfills like stream-browserify and buffer.
Builds fine, but getting the following error during runtime:
Does anyone have a working webpack 5 configuration including polyfills and required modules that they could share?
kelly-tock commentedon Jan 5, 2021
blikblum/pdfkit-webpack-example#9 (comment)
blikblum commentedon Jul 12, 2021
I just created a webpack 5 example showing how to bundle or load binary content at https://github.com/foliojs/pdfkit/tree/master/examples/webpack
yanickrochon commentedon Oct 27, 2022
Instead of providing a kitchen sink example, someone should provide a browser ready module. Seriously, why re-inventing the wheel in every project when a ready-to-use module would exist?