加载链接的npm包时出现@ ngtools / webpack错误 - “考虑将函数表达式更改为导出的函数。”

时间:2017-12-22 13:02:22

标签: angular webpack aot

我在编译链接的npm包时遇到问题,以便使用dev-server运行它(我从CLI中提取了一个webpack配置)。自从我更新为angular 5。

后出现此问题

提前谢谢!

错误

尝试编译程序包时始终会发生此错误,也不会生成任何文件:

ERROR in my-package/src/app/my.module.ts(198,2): Error during template compile of 'MyModule'
  Function expressions are not supported in decorators in 'NgModule'
    'NgModule' contains the error at @angular/core/core.ts(194,31)
      Consider changing the function expression into an exported function.

版本

node v8.2.1
npm v5.5.1
Mac OSX High Sierra

angular v5.1.1
@ngtools/webpack v1.9.2
webpack v3.10.0
typescript v2.5.3

如何重现

  • 做一个新的npm安装
  • 链接当前项目中的包
  • 运行dev build /启动dev服务器(不使用生产插件)

webpack配置

{
       //...
       module: {
            rules: [
               {
                    test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
                    use: [ '@ngtools/webpack' ]
                },
             ]
        },
        plugins: [
            new AngularCompilerPlugin({
               mainPath: "src/main.ts",
               sourceMap: true,
               tsConfigPath: "tsconfig.aot.json",
               entryModule: "src/app/app.module#AppModule"
            }), // ...
         ]
}
// ...

角度模块

@NgModule({
    // ...
    imports: [
        // ....
        MyModule.forRoot()
    ],
    // ...
})
export class AppModule {
}

@NgModule({
    imports: [
        CommonModule,
        FormsModule,
        ReactiveFormsModule,
        RouterModule,
        // ...
    ],
    declarations: [
         // ...
    ],
    exports: [
         // ...
    ]

})
export class MyModule {
    static forRoot(): ModuleWithProviders {
        return {
            ngModule: MyModule,
            providers: [
                // ...
            ]
        };
    }
}

使用已安装的软件包版本编译软件包工作正常并生成输出文件。

tsconfig files

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

tsconfig.aot.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "out-tsc/app",
    "baseUrl": "./",
    "module": "es2015",
    "types": []
  },
  "exclude": [
    "test.js",
    "**/*.spec.ts",
    "**/*.mock.ts"
  ]
}

0 个答案:

没有答案