Nested Angular add schematics

Question

I have a project Child that has an add schematic. If Child becomes a dependency of a project Parent which also has an add schematic, how would ng-cli handle this? I don't see any references to ng add cascading or calling through to dependency schemas. Would Parent need to replicate Child's schematic, or is there a way to manually call through to Child's schematic in the Parent schematic?

Answer 1

I really wish the documentation was better, but the solution ended up being a combination of two things:

First you can call an external schematic like so:

externalSchematic('@keysight/alloy', 'ng-add', options)

However, that alone is not enough since it won't be able to find your package. You'll need to install it first. Here's the final solution:

export function ngAdd(options: any): Rule {
  return (tree: Tree, context: SchematicContext) => {
    console.log('Adding Pathwave Core dependencies...\n');
    dependencies.forEach(dep => addPackageJsonDependency(tree, dep));
    const installTaskId = context.addTask(new NodePackageInstallTask());

    // Chain won't work here since we need the externals to be actually installed before we call their schemas
    // This ensures the externals are a dependency of the node install, so they exist when their schemas run.
    context.addTask(new RunSchematicTask('addExternals', options), [installTaskId]);
  };
}

export function addExternals(options: any): Rule {
  return (_tree: Tree, _context: SchematicContext) => {
    console.log('Running dependency schematics...\n');
    return chain([
      externalSchematic('@keysight/alloy', 'ng-add', options)
    ]);
  };
}

addExternals must be its own schematic in collection.json:

    "addExternals": {
      "description": "Calls dependency add schemas",
      "private": true,
      "factory": "./ng-add/index#addExternals"
    }