带有构建优化器的AOT和JIT

问题描述

我正在遵循此处的解决方案，该解决方案是使用JitCompilerFactory加载运行时编译器和自定义装饰器，以保留组件和模块的元数据.但是有了angular-cli --build-optimizer标志，我得到了:

I am following the solution here of using the JitCompilerFactory to load the runtime compiler and custom decorators to preserve the component and module metadata. But with the angular-cli --build-optimizer flag I get:

这里是我的最小复制品，请运行ng serve --aot --build-optimizer.作为控件，ng serve --aot起作用.

Here is my minimal reproduction, run ng serve --aot --build-optimizer. As a control ng serve --aot works.

推荐答案

如果使用选项--build-optimizer，则@angular-devkit/build-optimizer/webpack-loader加载器将添加到webpack加载器列表中.

If you use option --build-optimizer then @angular-devkit/build-optimizer/webpack-loader loader is added to webpack loaders list.

@angular-devkit/build-optimizer/webpack-loader从不属于platformWhitelist的类型的类型中删除ctorParameters定义(源):

@angular-devkit/build-optimizer/webpack-loader removes ctorParameters definitions from types that is not part of platformWhitelist (source):

const platformWhitelist = [
  'PlatformRef_',
  'TestabilityRegistry',
  'Console',
  'BrowserPlatformLocation',
];

我认为这是正确的行为.

I think that's correct behavior.

要解决此问题，您可以在JitCompilerFactory 已创建:

To work around it you could initialize ctorParameters manually before JitCompilerFactory is created:

import { 
  Compiler, ɵConsole as Console,
  Optional, Inject, Injector, 
  PACKAGE_ROOT_URL 
} from '@angular/core';

import {
  JitCompilerFactory,
  TemplateParser, CompilerConfig, CompileReflector,
  ElementSchemaRegistry, I18NHtmlParser, TEMPLATE_TRANSFORMS, DirectiveNormalizer,
  ResourceLoader, UrlResolver, HtmlParser, CompileMetadataResolver, NgModuleResolver,
  DirectiveResolver, SummaryResolver, PipeResolver, StaticSymbolCache, 
  ERROR_COLLECTOR_TOKEN,
  StyleCompiler, ViewCompiler, NgModuleCompiler, JitCompiler
} from '@angular/compiler';

import * as compiler from '@angular/compiler';

export function compilerFactory() {
  restoreDecorators();

  return new JitCompilerFactory([{ useDebug: false, useJit: true }]).createCompiler();
}

function restoreDecorators() {
  (compiler.Parser as any).parameters = [compiler.Lexer];
  (TemplateParser as any).parameters = [
    CompilerConfig, CompileReflector, compiler.Parser, ElementSchemaRegistry,
    I18NHtmlParser, Console, [new Optional(), new Inject(TEMPLATE_TRANSFORMS)]
  ];
  (DirectiveNormalizer as any).parameters = [
    ResourceLoader, UrlResolver,
    HtmlParser, CompilerConfig
  ];
  (CompileMetadataResolver as any).parameters = [
    CompilerConfig, NgModuleResolver, DirectiveResolver, PipeResolver, SummaryResolver,
    ElementSchemaRegistry,
    DirectiveNormalizer, Console,
    [new Optional(), StaticSymbolCache],
    CompileReflector,
    [new Optional(), new Inject(ERROR_COLLECTOR_TOKEN)]
  ];
  (StyleCompiler as any).parameters = [UrlResolver];
  (ViewCompiler as any).parameters = [CompileReflector];
  (NgModuleCompiler as any).parameters = [CompileReflector];
  (NgModuleResolver as any).parameters = [CompileReflector];
  (DirectiveResolver as any).parameters = [CompileReflector];
  (PipeResolver as any).parameters = [CompileReflector];

  (JitCompiler as any).parameters = [
    Injector,
    CompileMetadataResolver,
    TemplateParser,
    StyleCompiler,
    ViewCompiler,
    NgModuleCompiler,
    SummaryResolver,
    CompilerConfig,
    Console
  ];
  (UrlResolver as any).parameters = [[new Inject(PACKAGE_ROOT_URL)]];
}

由于编译器可能会进行内部更改，因此这似乎很有风险.它适用于@angular/[email protected]，但可能不适用于其他版本.

And it seems to be risky as compiler is subject to internal changes. It works for @angular/[email protected] but may not work for other releases.

这篇关于带有构建优化器的AOT和JIT的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！