I am working on a custom package that will override default Angular Schematics, by providing a custom template for spec files.
So running ng generate component
should create a component as in default schematics, but the spec file should be overridden by my template.
The package works as expected apart from the time that takes to generate a component. It takes over 3 minutes to generate it! I have no idea why as my setup looks pretty straightforward and I have no idea, what could be the bottleneck. I will appreciate any ideas, what could be wrong or at least how to check, what's causing the issue.
Here is my code:
collection.js
{
"$schema": "../node_modules/@angular-devkit/schematics/collection-schema.json",
"extends": [
"@schematics/angular"
],
"schematics": {
"component": {
"factory": "./component/index#Component",
"schema": "./component/schema.json"
},
}
}
factory - 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)),
])),
]);
}
template - file
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();
});
});
As you see, inside the function that generates component I've put a console log - it appears immediately in the terminal while running ng g component
, then it takes over 3 minutes to do the rest of the code...
I realised that the slow behaviour was a result of the filter
function. I guess it's not only filtering created files in the schematic, but it checks each project file.
Here is what I did to get rid of the filter
function :)
mergeWith(templateSource, MergeStrategy.Overwrite),
the templateSource
is the same as in the original question.