在 Angular 9 CLI webworker 中导入 mathjs 时出错

Posted 2023-03-15

【中文标题】在 Angular 9 CLI webworker 中导入 mathjs 时出错

【英文标题】：Error when importing mathjs in Angular 9 CLI webworker

【发布时间】：2020-09-13 11:19:07

【问题描述】：

我目前正在尝试使用 Angular CLI 9.1.7 将 webworker 添加到我的 Angular 9 项目中。 这个 webworker 应该使用 mathjs 7 运行一些计算。

但是，将 mathjs 导入 webworker 总是会导致浏览器控制台出现以下错误。 如果我不导入 mathjs，worker 运行没有问题。

index.js:7 Uncaught ReferenceError: window is not defined
    at Object../node_modules/seed-random/index.js (index.js:7)
    at __webpack_require__ (bootstrap:19)
    at Module../node_modules/mathjs/es/function/probability/util/seededRNG.js (seededRNG.js:1)
    at __webpack_require__ (bootstrap:19)
    at Module../node_modules/mathjs/es/function/probability/pickRandom.js (pickRandom.js:1)
    at __webpack_require__ (bootstrap:19)
    at Module../node_modules/mathjs/es/factoriesAny.js (factoriesAny.js:1)
    at __webpack_require__ (bootstrap:19)
    at Module../node_modules/mathjs/es/entry/pureFunctionsAny.generated.js (pureFunctionsAny.generated.js:1)
    at __webpack_require__ (bootstrap:19)

引用的行是

var GLOBAL = typeof global === 'undefined' ? window : global;

并且是 mathjs 中使用的 seed-random 库的一部分。 我知道window 在网络工作者中通常是未定义的，但是据我所知应该设置global。 在 angular-devkit 内部使用的 webpack 配置中，我找到了follwing section：

  plugins: [new WorkerPlugin(
    globalObject: false,
    plugins: [getTypescriptWorkerPlugin(wco, workerTsConfigPath)],
  )],

在那里，我已经尝试在我的本地node_modules 文件夹中将globalObject 设置为self 或this，但这并没有解决问题。 我也没有在angular.json 文件中看到一个选项来为 webworker 提供任何额外的配置来解决这个问题，所以我不确定该怎么做才能让它工作。 在mathjs documentation 中，我找到了一个在 webworker 中使用它的示例，所以我认为它也应该可以使用 Angular CLI。

我用一个最小的工作示例创建了一个GitHub repo。如果你运行它

npm install
npm start

您可以在浏览器控制台中看到描述的错误。

所以我的问题是：如何在 Angular CLI webworker 中使用 mathjs？

【参考方案1】：

我在 math.js GitHub 上打开了issue，其中提出了另一种解决方法： 似乎只需从

更改导入就足够了

import  sqrt  from 'mathjs';

到

import  sqrt  from 'mathjs/dist/math.js';

修复网络工作者。

此解决方法相当简单，而且似乎有效。但是，这个问题可能会在未来版本的 math.js 中得到解决。检查问题是否有更新可能是有意义的。