在 puppeteer 中加载和使用 JS 模块

Question

我正在构建一个供内部使用的 npm 包。它的功能之一是 DOM 解析，所以我需要在浏览器中加载它。我想使用 puppeteer 进行测试。

在文档中，我发现 page.injectFile() 可用于本地 JS 文件。但是，我的文件是一个模块（我正在注入的文件已经转译为常规 JavaScript），我不知道将其注入 puppeteer 的浏览器页面后该怎么做。

到目前为止我的代码：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  page.injectFile('../build/MyModule')
    .then(result => console.log(result))
    .then(error => console.log(error));
})();

我得到一个error、ReferenceError: require is not defined，因为我在MyModule 中使用了require。 我什至可以在 puppeteer 中使用这样的 JS 模块吗？如果可以，获取MyModule 实例并使用它的正确方法是什么？

Answer 1

我真的怀疑 puppeteer 能否实现这一点，因为它只是一个用于无头 chrome 的 nodejs 驱动程序。

如果您需要使用带有 cmd require(...) 的自定义模块，您可能需要使用像 webpack 这样的模块捆绑器来生成包含所有依赖项的捆绑文件，然后将 inject 放入 puppeteer 页面。

只要我的 2 美分。