交换到 pnpm 后构建失败：RollupError：意外字符 '\x7F' （由节点画布 / pdf.js 中的解析错误引起）

Question

预先感谢您的帮助。

TL;DR：我在构建时出现解析错误，从

node-canvas

和

pdf.js

冒泡。这是由 Rollup 读取

canvas.node

二进制文件引起的，它甚至不应该出现在构建输出中......

有没有办法为浏览器分辨率标记单个模块（

pdf.js

）？或者任何其他解决方案/解决方法允许

pdf.js

与

pnpm

一起使用？

我相信node-canvas

存储库中接受的解决方案

在这里不起作用，因为SvelteKit构建应该为节点和浏览器生成输出。

---

我已将包管理器更换为 pnpm 以获得 SvelteKit 应用程序。

在开发模式下运行时非常棒，但构建现在因这些原始日志而失败：

node_modules/.pnpm/[email protected]/node_modules/pdfjs-dist/build/pdf.js (1950:23)
Use of eval in "node_modules/.pnpm/[email protected]/node_modules/pdfjs-dist/build/pdf.js" is strongly discouraged as it poses security risks and may cause issues with minification.

# ... succesful build outputs
.svelte-kit/output/server/index.js                                                                                                    104.13 kB
.svelte-kit/output/server/entries/pages/room/_room_/[email protected]                                                              125.46 kB
.svelte-kit/output/server/chunks/media-handlers.js                                                                                    145.42 kB

Run npm run preview to preview your production build locally.

> Using @sveltejs/adapter-node
error during build:
RollupError: Unexpected character '' (Note that you need plugins to import files that are not JavaScript)
    at error (file:///home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:2245:30)
    at Module.error (file:///home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:13674:16)
    at Module.tryParse (file:///home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:14405:25)
    at Module.setSource (file:///home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:14006:39)
    at ModuleLoader.addModuleSource (file:///home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:24526:20)
 ELIFECYCLE  Command failed with exit code 1.

错误从

this rollup.js error()

函数

冒出来，它隐藏了一些信息。

将node_modules编辑到

console.trace

上的

base

后，我们有附加信息：

Trace: {
  cause: SyntaxError: Unexpected character '' (1:0) # <-- contains U+007f, invisible
  # ...
  code: 'PARSE_ERROR',
  id: '/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/build/Release/canvas.node',
  message: "Unexpected character '\x7F' (Note that you need plugins to import files that are not JavaScript)",
  frame: '1: \x7FELF\x02\x01\x01\x00\x00\x00\x00\x00\x'
   # ...
}
# ...

# Listing each of the ids in the trace: 

/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/build/Release/canvas.node
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/lib/bindings.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/index.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/lib/image.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/lib/canvas.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/lib/context2d.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/canvas/lib/pattern.js
/home/oscarhermoso/Git/org-repo/node_modules/.pnpm/[email protected]/node_modules/pdfjs-dist/build/pdf.js

我的解释是 Rollup 在构建时评估

canvas-node

 二进制文件。这是不幸的，因为根本不需要它，

pdf.js

包只是为浏览器捆绑的。

我也不确定为什么这种行为是由将包管理器从

npm

 交换到 

pnpm

 引起的。

我在尝试解决或解决这个问题时遇到了困难，除了换回

npm

之外，所以任何建议将不胜感激。谢谢！

Answer 1

好的，明白了。

我只在浏览器中使用

pdf.js

，因此我可以通过将 

node-canvas

 标记为可选依赖项，然后在 CI/CD 中跳过它来排除它。

也可能存在与

pdf-js

 版本 

^3.9.179 的问题/不兼容

解决步骤：

将
1. "canvas": "*"

    添加到 

   optionalDependencies 中的

   package.json

更新
2. pdfds-dist

   到最新版本（当前

   v3.10.111

   ）

3. rm -rf node_modules
4. pnpm install

    更新 

   pnpm-lock.yaml

    文件

使用
5. pnpm --no-optional

    进行测试，然后使用 

   pnpm build
更新您的 CI/CD 管道或 Dockerfile 以包含
6. pnpm install --no-optional

    而不是 

   pnpm install

   。