如果模板中没有引用 ViewChild，是否可以将其标记为私有？

我已经能够做到这一点，然后使用“--prod”标志构建和提供服务，并且没有遇到任何错误。我目前正在使用 Angular 7。

@ViewChild(HelloComponent) private helloComponent;

这是我正在谈论的堆栈闪电战：https ://stackblitz.com/edit/angular-vxbpuk?file=src%2Fapp%2Fapp.component.ts

我想我有使用 aot 的 stackblitz，但你可以在本地验证同样的事情。

编辑：我很抱歉之前没有提出这个问题，但是角度文档中的这个模糊让我停下来：

https://angular.io/guide/aot-compiler#phase-2-code-generation

装饰组件类成员必须是公共的。您不能将 @Input() 属性设为私有或内部。

但正如@GCSDC 在下面已经指出的那样，Angular 团队似乎在他们的示例中使用了私有成员：https ://angular.io/guide/component-interaction#parent-calls-an-viewchild

所以我一直在构建一个 Angular 9 应用程序，其中有一个客户仪表板来管理他们保存在服务器上的模板。可以通过激活系统在不同设备上查看这些模板，从而将设备绑定到用户。

所以让https://templates.com我们说我们有/login, /dashboards,/manage带有查看和编辑数据的子路径。在这个 url 上，我们也在/:companyName这个路径上请求一个模板，其中包含带有插值字符串的 html，以及将被动态加载的 css。

到目前为止，由于alarm9k 的帖子，我能够实现这一目标。

此解决方案发生的唯一问题是，在构建应用程序时您无法使用，ng build --prod因为 using--prod将不起作用，因为 angular 编译器未包含在 AOT 中，因此您陷入了 JIT。

这将导致一个更大的应用程序，在我的情况下，大小几乎是 42MB。所以我想减小文件大小，因为这会极大地影响应用程序的延迟。我一直在查看应用程序和 atm 的统计信息，它的延迟 http p95 延迟为 1.2 秒，http 平均延迟为 340 毫秒。

当使用不同的网站速度测试并选择英国作为测试应该运行的地方。我得到的加载时间值大约为 600-900 毫秒。检查多个位置时，它给了我 5 秒的平均加载时间。

问题：

所以我想知道是否有办法将应用程序分成 2 个，其中一个处于 AOT 模式，另一个处于 JIT 模式，如果将一部分保持在 JIT 模式下是安全的，并且这是否可以最大限度地减少申请与否。

如果这是不可能的，我想知道最小化此应用程序的最佳方法是什么，以及如何做到这一点。

或者，如果有一种方法至少可以使应用程序更安全，因为在 JIT 模式下可以在浏览器中查看所有代码。

编辑 1：

我忘了提到，在我的情况下，我使用 socket.js 作为激活系统，因此仪表板和模板有些关联。因此，当转到/:companyname并且设备未连接之前，它会自动转到/activate生成代码的位置并侦听用户是否输入该代码，以便将设备连接到用户帐户。

编辑2：

我一直在读到 …

我使用 Angular AOT 编译器版本 4.1.3

我有一个组件库，它导出一个工厂方法，然后用于提供服务：

export function libServiceFactory(itemId: string) {
  return (http: Http): LibService => {
    return new LibService(http, itemId);
  };
};

我编译库与ngc成功。

然后导入编译好的库，我LibServiceFactory在网站的 AppModule 中使用：

providers: [
  { provide: SERVICE_TOKEN, useFactory: libServiceFactory('foo'), deps: [Http] }
],

我编译网站，ng build我收到以下错误：

ERROR in Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function (position 5:10 in the …

我所有的 svg 在开发模式下都能完美运行，只要我运行 `ng build --prod --aot"，它们就不会加载。它们都回退到 png 图像。我不知道如何修复它。我有已经在github上，并尝试过

• 绝对路径
• 相对路径
• 绑定与插值

我正在使用 angular 4.4.3

和 angular/cli 1.5.4

html：

<img
    class="chain"
    src="../assets/svgs/LinkWardenChain.svg"
    alt="Linkwarden chain graphic"
    onerror="this.src='../assets/images/LinkWardenChain.png'"
>

另一个例子：

<img
    class="chain"
    [src]="ethernet1"
    alt="ethernet connected graphic"
>

*由于 3rd 方软件包支持，我目前无法升级到 angular 5

解决方案

感谢 Mathew 的回答，将文件路径添加到 cli assets 文件夹：

"assets": [
        "assets",
        "favicon.ico",
        "./src/assets/svgs/eth-100.svg",
        "./src/assets/svgs/eth-1000.svg",
        ...etc...
      ],

在Angular 5发布之前,我可以通过官方文档https://angular.io/guide/aot-compiler配置AOT

据我所知,官方文档将重点转移到CLI.在没有使用CLI的情况下,是否有关于Angular 5 AOT的结构化指南？

(我看过这个链接https://github.com/angular/angular/issues/19339#issuecomment-332607471)

我想动态创建一个URL树,并在Angular的路由器中使用它而不是"魔术"字符串.我有这些课程:

export abstract class UrlNode {
    protected parentUrl?: string;
    protected abstract shortUrl: string;

    constructor(parent: UrlNode) {
        this.parentUrl = parent && parent.path;
    }

    public get segmentUrl(): string {
        return this.shortUrl;
    }

    public get path(): string {
        if (!this.parentUrl) {
            return this.shortUrl;
        }

        if (!this.shortUrl) {
            return this.parentUrl;
        }

        return `${this.parentUrl}/${this.shortUrl}`;
    }
}

export class Profile extends UrlNode {
    protected shortUrl = "profile";
}

export class User extends UrlNode {
    public readonly profile: Profile;
    public readonly someSubroute: SomeSubroute;

    protected shortUrl = "user"; …

我写了一个带有一些服务的角度库,可以在不同的角度应用中使用它.没有--prod,所以没有AOT编译,在角度应用程序中一切正常.

使用ng-packagr以及cli以及一些不同的yeoman生成器生成库每次都会产生相同的错误.此外,我尝试了不同的ng版本(5.xx,6.xx和7.xx).但是在所有情况下,当我在应用程序的app.module中调用LoggerModule.forRoot()时,每次(使用AOT)都会出现相同的错误:

ERROR in Error during template compile of 'AppModule' 
Function calls are not supported in decorators but 'LoggerModule' was called.

我阅读了很多关于这个主题的文章,在tsconfig中尝试了不同的angularCompilerOptions.有什么进一步的想法吗？该模块在没有AOT的情况下工作正常(但这不是我们的选择)......

图书馆的NgModule:

@NgModule({
  declarations: [],
  imports: [],
  providers: []
})
export class LoggerModule {

  static forRoot(): ModuleWithProviders {
    return {
        ngModule: LoggerModule,
        providers: [LoggerService]
    }
  }
}

NgModule的应用:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    LoggerModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent],
  entryComponents: [AppComponent]
})
export class AppModule {
}

I am working on a angular 7 app which works fine except loading issues, on research I found that I should be using AOT build instead of JIT or normal build, I was not able to make aot build because of huge application size, it was returning heap our of memory issue. Later I removed some modules and components to make AOT build possible which worked but then I realized that AOT build file size is much larger than normal …

该角文档指定几个原因支持JIT的使用AOT编译：

• 更快的渲染
• 更少的异步请求
• 较小的 Angular 框架下载大小
• 更早地检测模板错误
• 更好的安全性

但是，在寻找使用 JIT 的参数时，我没有找到。此外，从 Angular 5.2 升级到 Angular 8 后，我在运行开发构建（使用 JIT）时突然遇到一个奇怪的错误。错误是：

ERROR in ./src/app/shared/app-configuration/shared/app-configuration.model.ts 22:16-35
"export 'IMyComponents' was not found in '@mycompany/mypackage'

运行产品构建（使用 AOT）时，一切正常。这让我感到惊讶，因为我从未遇到过prod 构建成功而dev 构建失败的 Angular 编译问题。

所以我的假设是 JIT 只适用于开发构建（即速度）。添加--aot标志可以安全地完成，没有任何问题。或者我错过了什么？

AOT with ngc 和 rollup 有什么区别