Question

我正在尝试使用Worker Loader设置Angular项目。我能够运行应用程序，但在运行业力时失败了！这是我的方法：

使用ng new webpack-worker-loader-karma创建项目 - ＆gt; ng serve和ng test正常工作
将webpack worker-loader添加到项目npm i -D worker-loader
创建的工人打字稿文件src/app/simple-loader.ts

在src/typings.d.ts中创建了工作人员类型定义：

declare module 'worker-loader?inline!*' {
  class WebpackWorker extends Worker {
  constructor();
}

export default WebpackWorker;
}

在src/app/app.component.ts - ＆gt;中添加了实例化工作人员的代码ng serve返回此错误：

ERROR in ./node_modules/@ngtools/webpack/src!./src/app/simple-worker.ts
Module build failed: Error: @ngtools/webpack is being used as a loader but no `tsConfigPath` option nor AotPlugin was detected. You must provide at least one of these.
    at Object.ngcLoader (/[path]/webpack-worker-loader-karma/node_modules/@ngtools/webpack/src/loader.js:617:19)

`

必须在webpack.config.js中设置tsConfigPath。所以我弹出了项目并更改了配置：

{
    "test": /\.ts$/,
    "loader": "@ngtools/webpack",
    "options": {
      "tsConfigPath": "src/tsconfig.app.json",
    }
}

npm start - ＆gt;作品！

npm test - ＆gt;错误：

ERROR in ./node_modules/@ngtools/webpack/src!./src/app/simple-worker.ts
    Module build failed: Error: @ngtools/webpack is being used as a loader but no `tsConfigPath` option nor AotPlugin was detected. You must provide at least one of these.
        at Object.ngcLoader (/[path]/webpack-worker-loader-karma/node_modules/@ngtools/webpack/src/loader.js:617:19)

我想我必须为业力设置tsConfigPath。但不知道如何。有什么想法吗？

我在github上发布了这个项目：

https://github.com/kappaj/webpack-worker-loader-karma

Answer 1

我在Ionic中有同样的问题（基于Angular）。我添加了＆＃34;模块＆＃34;部分到karma.conf.js

webpack: { 
  node: { 
    fs: 'empty' 
  },
  module: {
    rules: [
        {
          test: /\.ts$/,
          loader: "@ngtools/webpack",
          options: {
            tsConfigPath: "./src/tsconfig.spec.json",
          }
        },
        { test: /\.css$/, use: 'css-loader' },
        { test: /\.html$/, use: 'html-loader' },
        { test: /\.svg$/, use: 'html-loader' }
    ]
  }
}

此npm run test之后有效！

Webpack + Angular 5 +工作者加载器+ Karma

1 个答案: