ModuleNotFoundError：找不到模块：错误：无法解析“/home/pegasus/Documents/Final_Website/blog/node_modules/pdfjs-dist/build”中的“canvas”

Question

当我安装react-pdf时，出现以下错误：

ModuleNotFoundError: Module not found: Error: Can't resolve 'canvas' in '/home/pegasus/Documents/Final_Website/blog/node_modules/pdfjs-dist/build'

我正在尝试在盖茨比网站上呈现 pdf。但为此我需要react-pdf并且它抛出了这个错误。

Answer 1

要解决此特定错误，请先尝试安装canvas模块：

npm install canvas

如果您使用 Next.js 应用程序路由器，安装画布后可能会出现另一个错误：

./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)

要解决此错误，您需要安装“raw-loader”模块：

npm install raw-loader --save-dev

并将以下代码添加到您的

next.config.js

：

module.exports = {
 webpack: (config) => {
   config.module.rules.push({
     test: /\.node/,
     use: 'raw-loader',
   });

   return config;
 },
}

阅读文档以获取更多信息：https://www.npmjs.com/package/react-pdf