在最终应用程序中使用剧作家（电子）

Question

大家好，我在 Vue+Electron 的项目中使用 Playwright。 在 Electron 构建器设置中使用

externals: ['playwright-chromium']

但最终用户无法使用 Playwright 模块并出现错误：

看起来 Playwright Test 或 Playwright 刚刚安装或 更新。请运行以下命令下载新浏览器： npx 剧作家安装

用户如何在不安装 Node 和 Playwright 的情况下使用 Playwright 模块？我可以使用什么来将浏览器与 Electron-Builder 一起打包？

Answer 1

如果您看到与 Playwright 相关的错误消息，则可能尚未下载必要的浏览器二进制文件。以下是解决此问题的步骤：

使用

npm i playwright

在您的项目中安装 Playwright。 使用

npx playwright install

下载所需的浏览器。 在您的

package.json

中添加安装后脚本，将浏览器二进制文件复制到项目中的已知位置。

"scripts": {
  "postinstall": "node copy-playwright-browsers.js"
}

创建复制脚本

copy-playwright-browsers.js

，将浏览器二进制文件从

node_modules

目录复制到项目中所需的目录。

const fs = require('fs-extra');
const path = require('path');

const browsersDir = path.join(__dirname, 'node_modules', 'playwright', '.local-browsers');
const destinationDir = path.join(__dirname, 'playwright-browsers');

fs.copySync(browsersDir, destinationDir);

process.env.PLAYWRIGHT_BROWSERS_PATH = path.join(__dirname, 'playwright-browsers');

使用 Electron-Builder 和

npm run electron-builder

打包您的应用程序。 这些步骤应该有助于在打包 Electron 应用程序时包含浏览器二进制文件。如果您仍然遇到问题，请考虑在 Playwright GitHub 存储库中提出问题。请记住包含有关您的设置的详细信息以及您看到的确切错误消息。