Angular schematic is not creating files from templates

Question

I've created an angular schematic for the purposes of creating boilerplate code with an ng generate command, however despite all the articles I've read through and messing about, I cannot get the files to create.

I've the following code in my schematic factory:

export function createComponent(_options: any): Rule {
    return (tree: Tree, _context: SchematicContext) => {
        setupOptions(tree, _options);

        const movePath = normalize(_options.path + '/' + strings.dasherize(_options.name));

        const templateSource = apply(url('./files'), [
            template({
                ...strings,
                ..._options,
            }),
            move(movePath)
        ]);

        return mergeWith(templateSource);
    };
}

In the same directory as this is a files directory containing my "__name@dasherize__.component.ts" template which I'm expecting to get pulled in as part of the url('./files') function but I'm not sure this is happening.

My template file is as follows:

import { Component } from '@angular/core';

@Component({
    selector: 'wx-<%= dasherize(componentName) %>'
})
export class <%= classify(componentName) %>Component {

}

I'd expect a 'CREATE' to appear when I run the schematic but all I get is 'Nothing to be done.'

Oddly enough using tree.create() is successfully running to create files so I wonder if the url() or apply() functions are not running as expected.

Answer 1

Make sure that "./files" is a correct path relative to your schematic file inside the dist folder.

Maybe you need to change it to something like: "../../src/my-schematic/files".

Answer 2

Had the same problem but looking both at the source and docs Schematics for Libraries template file should end with .ts.template extension.

So in your case the file should be named __name@dasherize__.component.ts.template.

The output file will not contain .template extension.

Link to @angular/devkit source: applyTemplates()

Answer 3

A colleague had a similar issue and regardless of how I changed his code, it still seemed to do the same annoying thing.

It came down to the command that was used to run the schematics in the first place.

Before:

node_modules/.bin/schematics ./schematics:my-schematic-name --parameter

What it should be:

ng generate schematics:my-schematic-name --parameter

Your schematic needs to run in the context of the Angular CLI, by simply executing it in Node, it doesn't seem to output any files but still somehow succeeds in its execution.

Answer 4

Look at your .npmignore and .gitignore. Maybe you are ignoring all .ts wich makes that all your files with .ts under /files folder will be ignored.

Your .npmignore may look like this:

# .npmignore
# Ignores TypeScript files, but keeps definitions and .ts under /files folder.
*.ts
!*.d.ts
!/src/**/files/*.ts

Remember to do a npm run build to build your ts definitions before update your npm package.

Answer 5

You should consider the .npmignore file, which ignores files when working with npm; it works the same way as .gitignore. Add the following:

!src/**/files/**/*.ts

This does not ignore files within the files directory of any module, including any subdirectory within files.