I'm using multiple libraries involving QR codes and image processing inside a hook. I tried to follow along the webpack settings in the [docs](
https://payloadcms.com/docs/admin/webpack) regarding setting aliases for server-side modules to prevent Webpack from trying to bundle them. I'm getting multiple Webpack errors for multiple packages such as:
ERROR in ./node_modules/@jimp/core/es/index.js 42:33-46
Module not found: Error: Can't resolve 'fs' in '/mnt/c/Users/minanaro/Desktop/payload-cms/node_modules/@jimp/core/es'
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 }
const encodeImageWithQRPath = path.resolve(__dirname, "hooks/encodeImageWithQR.js");
const mockModule = path.resolve(__dirname, "util/mockObj.js");
export default buildConfig({
admin: {
webpack: config => {
return {
...config,
resolve: {
...config.resolve,
alias: {
...config.resolve.alias,
[encodeImageWithQRPath]: mockModule,
},
},
};
},
// and so on
mockModule.js is the same as the docs example, an empty object. I also have my encodeImageWith... hook. I checked the alias paths and they're correct. I also tried setting the fallback values for the modules to be false but to no avail.
What am I doing wrong?
Thanks for your help!
Oh, it seems deleting node_modules/.cache fixed it... Apologies! 😄
nice!
i was just about to say that
Coming back to revive this, struggled for a while and removing the .cache was the fixer for me too 👋
Yep, had the same problem and this fixed it!
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.