Web Worker能否导入node modules库？导入ml-random-forest报错如何解决？

报错根因 #

该报错由Web Worker写法错误+webpack模块打包优化规则共同导致：

• 你将Worker的运行逻辑全部包裹在export default导出的函数中，Worker加载后该函数不会被自动执行，导入的RandomForestClassifier未被实际调用，被webpack的摇树优化识别为无用代码删除，因此运行时提示模块未定义
• main.js中Worker构造函数拼写错误，首字母需要大写

修正步骤 #

1. 重写worker.js #

移除无用的export default包裹，直接在Worker顶层注册监听逻辑：

// worker.js
import { RandomForestClassifier as RFClassifier } from 'ml-random-forest';

onmessage=(e)=>{
    console.log('in worker')
    const classifier = new RFClassifier(e.data[0]);
    console.log('classifer'+ classifier)
    classifier.train(e.data[1],e.data[2])

    const result = classifier.predict(e.data[3]);
    const accuracy = calculateAccuracy(result, e.data[4]);
    console.log(accuracy)
    postMessage(accuracy)
}

const calculateAccuracy = (result, test_labels) => {
    let hits = 0;
    for(let i = 0; i<result.length; i++){
        if(result[i] == test_labels[i]){
            hits++;
        }
    }
    return hits / result.length;
}

2. 修正main.js代码 #

修正Worker初始化写法，删除主线程无用的RFClassifier实例化逻辑：

// webpack5环境导入写法，webpack4需提前配置worker-loader
import MyWorker from './worker.js?worker';

const myworker = new MyWorker();
// 其余原有代码保留

 setTimeout(async () => {  
        const options = {
            seed: 132456,
            maxFeatures: props.state.rf_config.rf_maxFeatures,
            replacement: false,
            nEstimators: props.state.rf_config.rf_nEstimators
          };
        // 删除主线程无用的RFClassifier实例化代码
         console.log('calling worker')
         myworker.onmessage = function (event){
              accuracy=event.data;
              console.log(event.data);
        }
        myworker.postMessage([options,training_dataset,training_labels,test_dataset,test_labels]);
  }, 100);

可选补充 #

如果仍存在模块未定义问题，可在worker.js顶部添加一行console.log(RFClassifier)主动引用导入的模块，避免被webpack识别为无用代码删除。

内容的提问来源于stack exchange，提问作者waseembangash