How to change the template file(s) for an existing nx schematic - reactjs

Question

I started to use https://nx.dev/ recently to reorganize an existing monorepo with multiple react frontends and redux state management.
nx provides the ability to create new redux slices out of the box using the #nrwl/react:redux schematic like: nx g #nrwl/react:redux <sliceName>. This is great! However, the template that is being used to create new files does not fit my needs (for example I do not use redux-thunk...) and I would like to use my own template.
I created a new custom schematic with nx g workspace-schematic redux-module and adjusted it to extend #nrwl/react:redux like:
import { chain, externalSchematic, Rule } from '#angular-devkit/schematics';
export default function(schema: any): Rule {
return chain([
externalSchematic('#nrwl/react', 'redux', {
name: schema.name
})
]);
}
Can anyone tell me how to proceed from here to make the custom schematic use my own template files?
Thanks!

Answer 1

You can have the template files inside the directory, load them and then copy to the target destination.e.g.
Dir structure:
Project_root
|- tools
|- schematics
|- your_schematics
|- index.ts
|- templates
|- __name#dasherize__.custom.ts
Content:
/* __name#dasherize__.custom.ts */
export class <%= classify(name) %>Custom {
constructor () {}
}
/* index.ts */
import { chain, externalSchematic, Rule, url, apply, move, mergeWith, MergeStrategy, template, SchematicContext } from '#angular-devkit/schematics';
import { dasherize, classify } from '#angular-devkit/core/src/utils/strings';
import { normalize, strings } from '#angular-devkit/core';
export default function(schema: any): Rule {
const libFileName = dasherize(schema.name);
const projectDirectory = schema.directory
? normalize(schema.directory + '/' + libFileName)
: libFileName;
const projectRoot = normalize('libs/' + projectDirectory);
return chain([
externalSchematic('#nrwl/workspace', 'lib', schema),
addCustomFileToLib(schema, projectRoot)
]);
}
function addCustomFileToLib(schema: any, projectRoot: string): Rule {
const templateFiles = url("./templates");
const newTree = apply(templateFiles, [
move(projectRoot),
template({
...strings,
...schema // pass the objects containing the properties & functions to be used in template file
})
]);
return mergeWith(newTree, MergeStrategy.Default);
}
Note: Name of template file(__name#dasherize__.custom.ts) is an expression which will be compiled/changed according to the name arg passed from cli while executing the schematics.