AoT編譯module.id錯誤Angular 2？

Question

我想爲我的angular 2項目進行AoT編譯。

我已經分居我的申請，js目錄下所有我產生.js文件和目錄app，我把我的.ts，.html和.css文件一起。

對於AOT編譯我用的是tsconfig.aot.json

{ 
    "compilerOptions": { 
    "target": "es2015", 
    "module": "es2015", 
    "moduleResolution": "node", 
    "declaration": false, 
    "removeComments": true, 
    "noLib": false, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "lib": ["es6", "es2015", "dom"], 
    "sourceMap": true, 
    "pretty": true, 
    "allowUnreachableCode": false, 
    "allowUnusedLabels": false, 
    "noImplicitAny": true, 
    "noImplicitReturns": true, 
    "noImplicitUseStrict": false, 
    "noFallthroughCasesInSwitch": true, 
    "outDir": "js", 
    "typeRoots": [ 
     "./node_modules/@types", 
     "./node_modules" 
    ], 
    "types": [ 
    ] 
    }, 
    "files": [ 
    "app/main.ts" 
    ], 
    "exclude": [ 
    "node_modules", 
    "js", 
    "app" 
    ], 
    "compileOnSave": false 
} 

和腳本："ngc": "ngc -p tsconfig.aot.json && npm run copy \"app/*\" \"compiled\" "

目前，我有我的COM，ponents這樣的：

@Component({ 
    selector: 'fs-mainbar', 
    templateUrl: 'app/mainbar/mainbar.component.html' 
}) 
export class MainbarComponent { 

但是，當我嘗試運行腳本它給了我這個錯誤：

> angular-quickstart@1.0.0 ngc C:\dev_escal\project\escal\ui\src\main\webapp 
> ngc -p tsconfig.aot.json && npm run copy "app/*" "compiled" 

Error: Compilation failed. Resource file not found: C:/dev_escal/project/escal/ui/src/main/webapp/app/mainbar/app/mainbar/mainbar.component.html 
    at ModuleResolutionHostAdapter.readResource (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler-cli\src\compiler_host.js:291:19) 
    at CompilerHost.loadResource (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler-cli\src\compiler_host.js:230:85) 
    at Object.get (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:26374:111) 
    at DirectiveNormalizer._fetch (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:13753:47) 
    at DirectiveNormalizer.normalizeTemplateAsync (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:13799:25) 
    at DirectiveNormalizer.normalizeTemplate (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:13771:48) 
    at CompileMetadataResolver._loadDirectiveMetadata (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:18074:79) 
    at C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd.js:18250:58 
    at Array.forEach (native) 
    at CompileMetadataResolver.loadNgModuleDirectiveAndPipeMetadata (C:\dev_escal\project\escal\ui\src\main\webapp\node_modules\@angular\compiler\bundles\compiler.umd 
.js:18249:45) 
Compilation failed 

這樣就OK了，我應該使用module.id，而是因爲我已經seprated我的應用程序爲js和app文件夾，我不得不使用它是這樣的：

@Component({ 
    moduleId: module.id.replace("/js/", "/app/"), 
    selector: 'escl-mainbar', 
    templateUrl: './mainbar.component.html' 
}) 
export class MainbarComponent { 

該怎麼過給了我這個錯誤：

> angular-quickstart@1.0.0 ngc C:\dev_escal\project\escal\ui\src\main\webapp 
> ngc -p tsconfig.aot.json && npm run copy "app/*" "compiled" 

Error encountered resolving symbol values statically. Calling function 'module', function calls are not supported. Consider replacing the function or lambda with a re 
ference to an exported function, resolving symbol MainbarComponent in C:/dev_escal/project/escal/ui/src/main/webapp/app/mainbar/mainbar.component.ts, resolving symbol 
MainbarComponent in C:/dev_escal/project/escal/ui/src/main/webapp/app/mainbar/mainbar.component.ts 

所以我幾乎堅持從這裏。我怎樣才能解決這個問題？任何幫助，歡迎:)

問題在GitHub上：

https://github.com/angular/angular/issues/14374

Answer 1

試試這個：

export function moduleId() { 
    return module.id.replace("/js/", "/app/"); 
} 

@Component({ 
    moduleId: moduleId(), 
    selector: 'escl-mainbar', 
    templateUrl: './mainbar.component.html' 
}) 
export class MainbarComponent { } 

類似的問題：Angular2 AoT Compiler Errors

有關AOT編譯的更多信息，以及其優於JIT彙編訪問：Ahead-of-time (AOT) vs Just-in-time (JIT)