共享 Angular 2 模块在构建 aot 时抛出错误

Question

我创建了一个共享的 angular 2 模块来分离可重用的组件。一切正常，但在构建 aot 时出现以下错误，pfb 错误

Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol Injectable in D:/Shared_Module/node_modules/@angular/core/src/di/metadata.d.ts, resolving symbol OpaqueToken in D:/ Shared_ Module/node_modules/@angular/core/src/di/opaque_token.d.ts, resolving symbol OpaqueToken in D:/Shared_ Module/node_modules/@angular/core/src/di/opaque_token.d.ts

PFB示例代码及代码结构

Base_Module
------------------
|
|___module.ts @NgModule
|
|___components
|
|___node_modules
|
|___package.json
|
|___tsconfig.json

Shared_Module
------------------
|
|___module.ts @NgModule
|
|___components -> Shared_Components
|
|___node_modules
|
|___package.json
|
|___tsconfig.json

下面是基本模块的module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { Shared_Module } from './../../../../SharedModule/module'; --**Including the shared module here**

@NgModule({
  declarations: [
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    SharedModule  -- **New shared module**
  ],
  exports:   [],
  bootstrap: []
})

export class Base_Module { }

下面是共享模块中的module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

@NgModule({
  declarations: [
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  exports:   [Shared_Component],
  bootstrap: []
})

export class Shared_Module { }

这里是 tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  },

  "files": [
    "src/app/module.ts",
    "src/main.ts"
  ],

  "angularCompilerOptions": {
   "genDir": "aot",
   "skipMetadataEmit" : true
}
}

应用程序运行良好。 aot编译可能有什么问题。欢迎所有帮助。提前致谢！

Answer 1

首先，应该导入CommonModule，而不是BrowserModule（在共享模块中）。

看这里：

https://angular.io/docs/ts/latest/cookbook/ngmodule-faq.html#!#q-browser-vs-common-module

其次，OpaqueToken 已弃用：

https://angular.io/docs/ts/latest/api/core/index/OpaqueToken-class.html

改用InjectionToken：

https://angular.io/docs/ts/latest/api/core/index/InjectionToken-class.html

看看这些东西是否有帮助。