无法找到管道--角度升级后出错

Question

我试图升级到最新的(7.0.3)，一切都很好，直到生产编译。我在信中收到：

ERROR in : Template parse errors:
The pipe 'filter' could not be found ("v class="form-group">
    <ul class="ui-select-list">
      <li [attr.name]="item.id" *ngFor="let [ERROR ->]item of data | filter : qModel" innerHtml="{{ 'AAA' | translate }}"></li>
    </ul>
</div>
"): C:/x/src/app/components/ui/fields/combo/ui.combo.html@2:44
The pipe 'translate' could not be found ("s="ui-select-list">
      <li [attr.name]="item.id" *ngFor="let item of data | filter : qModel" inn[ERROR ->]erHtml="{{ 'AAA' | translate }}"></li>
    </ul>
</div>
"): C:/x/src/app/components/ui/fields/combo/ui.combo.html@2:79

为了重现错误，我从代码中创建了一个最小的存储库：https://github.com/ptrstpp950/myBugInAngular

结果如下：

• ng build --prod app产生上述错误
• ng build app工作100%精细

我试着阅读共享模块中的管道，我试着按照指南进行更改，但仍然没有成功。

Answer 1

从您的tsconfig.json中可以看出，您在您的角7项目中使用了常春藤渲染器。

如下所示-

"angularCompilerOptions": {
    "enableIvy": true
  }

您可以将其设置为"enableIvy": false，然后再试一次生产构建。

在生产建造(ng build --prod)过程中，由于树的晃动，它会移除管道。常春藤还不能完全兼容，它只能用于测试目的。在使用常春藤之前，您需要运行ngcc来转换前常春藤包以包含常春藤定义，ngcc是来自@angular/compiler-cli的命令行工具。

请参阅下面有关常春藤渲染器的链接

https://github.com/angular/angular/blob/master/packages/core/src/render3/STATUS.md#implementation-status

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

Answer 2

如果您在多个模块中使用，您可以制作一个 共享模块 ，并从该共享模块导出所有管道。

例如，只需创建一个共享模块，如下所示：

import { NgModule, ModuleWithProviders } from '@angular/core';
import { CommonModule } from '@angular/common';

import { SearchFilterPipe } from './search-qafilter.pipe';
import { CapitalizePipe } from './search-question.pipe';

@NgModule({
  imports: [
    CommonModule,
    SharedRoutingModule
  ],
  declarations: [SearchFilterPipe , CapitalizePipe],
  providers: [],
  exports: [SearchFilterPipe , CapitalizePipe]
})
export class SharedModule {}

并在您喜欢的任何模块中导入这个共享模块，管道就可以从那里访问，而不会引发任何错误。