AOT 角度模块

Question

至少一个月以来，我一直在尝试导出一个简单的 Angular4 模块以在另一个项目中工作。阅读了很多文章，但它不起作用。 这里a file containing two folders：

lib -> Containing a simple Angular4 module
demo -> Containing a simple AngularCli project

lib 是 Angular 模块的一个非常简单的实现，demo 是在其根模块中导入该模块。

无论我做什么，演示应用程序都会给我不同类型的错误，说 lib 不是 Angular 模块。 有时说不包括装饰器，有时会出现这个错误：

错误中的错误遇到静态解析符号值。 不支持函数调用。考虑更换功能或 lambda 引用导出的函数（位置 194:50 在 原始 .ts 文件），解析符号 NgModule

我尝试定位 es5 和 es2015，但运气不佳。

重现问题的步骤：

1. 下载 zip 并将其解压缩到文件夹中

2. cd lib 文件夹

3. 运行npm install 或yarn install 安装依赖项

4. 运行 npm run bundle 或 yarn bundle 将库捆绑到 dist

5. cd demo 文件夹

6. 运行npm install或yarn install

7. 运行npm install ../lib 或yarn add file:../lib 安装位于lib 文件夹内的本地ng-test-lib

8. 运行npm start或yarn start启动Demo项目

更新：

我在这里添加一些文件的内容：

lib/src/a-module.ts

import { NgModule } from '@angular/core';
import { ADirective } from './a-directive';

@NgModule({
    declarations: [
        ADirective,
    ],
    exports: [
        ADirective,
    ]
})
export class AModule {}

lib/src/a-directive.ts

import {
    Input,
    OnInit,
    Directive,
 } from '@angular/core';

@Directive({
    selector: '[aDir]',
})
export class ADirective implements OnInit {
    @Input() test: string;

    ngOnInit() {
        console.log(`I'm the directive, and this is test value: ${this.test}`);
    }
}

lib/tsconfig.aot.json

{
    "compilerOptions": {
        "sourceMap": true,
        "inlineSources": true,
        "declaration": true,
        "noImplicitAny": false,
        "skipLibCheck": true,
        "stripInternal": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "suppressImplicitAnyIndexErrors": true,
        "module": "es2015",
        "target": "es5",
        "moduleResolution": "node",
        "lib": [
            "es2015",
            "dom"
        ],
        "outDir": "./dist",
        "rootDir": "./src",
        "baseUrl": ".",
        "types": []
    },
    "files": [
        "./src/a-module.ts"
    ],
    "angularCompilerOptions": {
        "strictMetadataEmit": true,
        "skipTemplateCodegen": true,
        "annotateForClosureCompiler": true,
        "flatModuleOutFile": "index.js",
        "flatModuleId": "index",
        "genDir": "./dist"
    }
}

有人知道这里发生了什么吗？

Answer 1

所以问题在于对文件夹进行符号链接，这意味着如果您使用npm install ../lib，问题就不会发生！我没有尝试，因为我认为它与yarn add file:../lib 相同，但不是。

最后，这是一个与 @angular/compiler 相关的问题，它无法与符号链接目录一起正常工作。

就是这样。

我希望这可以帮助其他人不要像我一样浪费时间。

更新 请注意，如果您使用的是 npm v5，则会发生此问题，因为它使用符号链接来链接本地包。