To solve this specific error, try installing canvas module first:
npm install canvas
If you are using Next.js app router, another error might appear after installing canvas:
./node_modules/canvas/build/Release/canvas.node
Module parse failed: Unexpected character '�' (1:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
To solve this error, you need to install 'raw-loader' module:
npm install raw-loader --save-dev
And add following code to your next.config.js
:
module.exports = {
webpack: (config) => {
config.module.rules.push({
test: /\.node/,
use: 'raw-loader',
});
return config;
},
}
Read documentation for more info: https://www.npmjs.com/package/react-pdf