如何使用 preact-cli + jspdf 进行构建

如何解决如何使用 preact-cli + jspdf 进行构建

我正在尝试在 jspdf 样板文件上保存带有 preact-cli 的 pdf 文件。我正常启动我的项目：

npx preact-cli create <template-name> <app-name>

npm install --save jspdf 之后，我使用此代码保存文件（绑定到一个按钮）：

import { jsPDF } from "jspdf";


const geraPdf = (props) => {
    const doc = new jsPDF();

    doc.text("Hello World! " + props,10,10);
    doc.save("a4.pdf");

}

export default geraPdf

当我在开发服务器 (npm run dev) 上运行它时，它工作正常。但我无法将其构建到生产环境 (npm run build)

这是我的错误：

错误模板执行失败：类型错误：无法读取属性 'bind' of undefined × ERROR TypeError: 无法读取属性 'bind' 未定义的

ssr-bundle.js:5474 Object.6PsS XXXXXXXXXXXXXXXXXXXXXXXX/build/ssr-build/ssr-bundle.js:5474:39
ssr-bundle.js:27 webpack_require XXXXXXXXXXXXXXXXXXXXXXXX/ANPP/build/ssr-build/ssr-bundle.js:27:30
ssr-bundle.js:2661 Object./jyc XXXXXXXXXXXXXXXXXXXXXXXX/ANPP/build/ssr-build/ssr-bundle.js:2661:16
ssr-bundle.js:27 webpack_require XXXXXXXXXXXXXXXXXXXXXXXX/ANPP/build/ssr-build/ssr-bundle.js:27:30
ssr-bundle.js:92 XXXXXXXXXXXXXXXXXXXXXXXX/build/ssr-build/ssr-bundle.js:92:18
ssr-bundle.js:95 对象。 XXXXXXXXXXXXXXXXXXXXXXXX/build/ssr-build/ssr-bundle.js:95:10
loader.js:1200 Module._compile 内部/模块/cjs/loader.js:1200:30
loader.js:1220 Object.Module._extensions..js 内部/模块/cjs/loader.js:1220:10
loader.js:1049 Module.load 内部/模块/cjs/loader.js:1049:32
loader.js:937 Function.Module._load 内部/模块/cjs/loader.js:937:14
loader.js:1089 Module.require 内部/模块/cjs/loader.js:1089:19
helpers.js:73 需要内部/模块/cjs/helpers.js:73:18
prerender.js:32 预渲染 [XXXX]/[preact-cli]/lib/lib/webpack/prerender.js:32:11
render-html-plugin.js:37 Object.ssr [XXXX]/[preact-cli]/lib/lib/webpack/render-html-plugin.js:37:55
template.html:110 t41+.module.exports [XXXX]/[preact-cli]/lib/resources/template.html:110:37
index.js:264 [XXXX]/[html-webpack-plugin]/index.js:264:16

查看 JSPDF，他们建议使用自定义 webpack 配置：

// webpack.config.js
module.exports = {
  // ...
  externals: {
    // only define the dependencies you are NOT using as externals!
    canvg: "canvg",html2canvas: "html2canvas",dompurify: "dompurify"
  }
};

preact-cli 使用自定义 webpack 配置。您应该创建一个名为 preact.config.js 的文件来对 webpack 进行更改，但我现在知道如何在 preact 文件上实现它，我不知道它是否会起作用。

有什么好心人可以帮帮我吗？