Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[HowTo] Generate publishable angular schematics?

See original GitHub issue

I’m trying to generate a publishable angular schematic. But I can’t figure it out.

I see generators like @schematics/angular and workspace-schematics but they don’t seem to what I want.

There’s a tools/schematics folder which suggests that there is some support.

Please advice, thanks.

Issue Analytics

State:
Created 4 years ago
Comments:6 (1 by maintainers)

Top GitHub Comments

3reactions

beemancommented, May 7, 2020

@snebjorn I tried to take a shot at adding a schematics library that I can publish, I based it off of the @nrwl/node:lib which I created with the publishable flag.

I’ve added 2 schematics, a simple hello-world and one called ng-add which can be installed using ng add @your-org/schematic.

You can find the repo here, both schematics have a separate commit.

In order to copy over the collection.json and lib/**/schema.json files, make sure to add something like this.

With this in place the build is an npm package with schematics enabled.

$ ng build schematics
Compiling TypeScript files for library schematics...
Done compiling TypeScript files for library schematics
Copying asset files...
Done copying asset files.
$ find dist/libs/schematics
dist/libs/schematics
dist/libs/schematics/index.js
dist/libs/schematics/README.md
dist/libs/schematics/package.json
dist/libs/schematics/lib
dist/libs/schematics/lib/hello-world
dist/libs/schematics/lib/hello-world/index.js
dist/libs/schematics/lib/hello-world/index.js.map
dist/libs/schematics/lib/hello-world/index.d.ts
dist/libs/schematics/lib/collection.json
dist/libs/schematics/lib/ng-add
dist/libs/schematics/lib/ng-add/index.js
dist/libs/schematics/lib/ng-add/schema.js.map
dist/libs/schematics/lib/ng-add/schema.js
dist/libs/schematics/lib/ng-add/index.js.map
dist/libs/schematics/lib/ng-add/schema.json
dist/libs/schematics/lib/ng-add/schema.d.ts
dist/libs/schematics/lib/ng-add/index.d.ts
dist/libs/schematics/index.js.map
dist/libs/schematics/index.d.ts

2reactions

snebjorncommented, May 7, 2020

@beeman thank you.

meanwhile I’ve got a working version of “bundled schematic” here https://github.com/datorama/akita/tree/master/libs/akita-schematics

In the target package I just assume the schematic is there https://github.com/datorama/akita/blob/master/libs/akita/package.json#L37

And then I just build the schematic when i build the target library. NX support for this would be great. Hence my “trigger it after a my-lib build” comment in OP. https://github.com/datorama/akita/blob/master/package.json#L35

Top Results From Across the Web

Schematics for libraries - Angular

To start a collection, you need to create the schematic files. The following steps show you ... In your library's root folder, create...

Quick Guide to Angular Schematics: How I Built My First ...

You'll need to create a NPM account first if you haven't already. You can do this on the website or directly in the...

How to create your own Angular Schematics

We'll start by creating the new-project schematic. To do that, we're going to use an NPM package called schematics . You'll need to...

Use Angular Schematics to Simplify Your Life | Okta Developer

Use Schematics to add Authentication to Your Angular App · Angular CLI, Angular Schematics, and Angular DevKit · Create Your First Schematic. Add ......

Angular Schematics from 0 to publishing your own library (III)

Generating a blank schematic is super straight forward with the schematics-cli. ... As you can already appreciate, we're simply invoking the schematics function ......