自定义 Angular Schematics 非常慢

如何解决自定义 Angular Schematics 非常慢

我正在开发一个自定义包，该包将通过为规范文件提供自定义模板来覆盖默认的 Angular Schematics。 因此，运行 ng generate component 应该会像在默认原理图中一样创建一个组件，但我的模板应该覆盖规范文件。

除了生成组件所需的时间外，该包按预期工作。生成它需要3分多钟！我不知道为什么我的设置看起来很简单，我不知道瓶颈是什么。 我将不胜感激任何想法，可能是什么错误或至少如何检查，是什么导致了问题。

这是我的代码：

collection.js

{
  "$schema": "../node_modules/@angular-devkit/schematics/collection-schema.json","extends": [
    "@schematics/angular"
  ],"schematics": {
    "component": {
      "factory": "./component/index#Component","schema": "./component/schema.json"
    },}
}

工厂 - index.ts

export function parseName(path: string,name: string) {
  const nameWithoutPath = basename(name as Path);
  const namePath = dirname((path + '/' + name) as Path);

  return {
    name: nameWithoutPath,path: normalize('/' + namePath),};
}

export function Component(_options: any): Rule {
  const parsedpath = parseName(_options.path || '.',_options.name);
  console.log('generating component using custom schematics');

  return chain([
    externalSchematic('@schematics/angular','component',_options),filter(f => !f.endsWith('spec.ts')),mergeWith(apply(url('./files'),[ // Custom spec files are located here.
      template({
        ..._options,name: parsedpath.name,classify: strings.classify,dasherize: strings.dasherize,}),move(normalize(parsedpath.path as string)),])),]);
}

模板 - 文件

import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';

describe('<%= classify(name) %>Component',() => {
  let component: <%= classify(name) %>Component;

  beforeEach(() => {
    component = new <%= classify(name) %>Component();
  });

  it('should create',() => {
    expect(component).toBeTruthy();
  });
});

如您所见，在生成组件的函数中，我放置了一个控制台日志 - 它在运行 ng g component 时立即出现在终端中，然后需要 3 多分钟才能完成其余代码。 .

解决方法

我意识到缓慢的行为是 filter 函数的结果。我想它不仅会过滤原理图中创建的文件，还会检查每个项目文件。

这是我为摆脱 filter 函数所做的工作:)

mergeWith(templateSource,MergeStrategy.Overwrite),

templateSource 与原始问题中的相同。