{"id":21575553,"url":"https://github.com/rangle/custom-angular-schematic-demo","last_synced_at":"2025-08-10T10:25:36.790Z","repository":{"id":102476629,"uuid":"464573202","full_name":"rangle/custom-angular-schematic-demo","owner":"rangle","description":"Custom schematics for libraries","archived":false,"fork":false,"pushed_at":"2023-02-21T20:14:03.000Z","size":225,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-03-24T14:13:29.298Z","etag":null,"topics":["angular-schematics","cli-app"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rangle.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-02-28T17:10:22.000Z","updated_at":"2024-03-05T10:31:10.000Z","dependencies_parsed_at":null,"dependency_job_id":"c679ee26-d9c3-4ddb-b7fb-2dcc501a2cfd","html_url":"https://github.com/rangle/custom-angular-schematic-demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rangle%2Fcustom-angular-schematic-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rangle%2Fcustom-angular-schematic-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rangle%2Fcustom-angular-schematic-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rangle%2Fcustom-angular-schematic-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rangle","download_url":"https://codeload.github.com/rangle/custom-angular-schematic-demo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248252690,"owners_count":21072700,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular-schematics","cli-app"],"created_at":"2024-11-24T12:13:36.084Z","updated_at":"2025-04-10T16:32:14.003Z","avatar_url":"https://github.com/rangle.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Custom Angular Schematics for Libraries\n\nThis is a demo repository for the blog post \"How to Use Custom Schematics to Supercharge Developer Experience\".\n\n## Get Started\n\n- Clone this repository\n- Change to the `schematics` folder and run `npm install`\n- Run `npm run build` to build the schematics, or run `npm run dev` to build the schematics on watch mode\n- Run `npm link` in the `schematics` folder\n- Change to the `demo-app` folder and run `npm install`\n- Once the installation is complete, also run `npm link ds-schematics` to link the custom schematics to the demo app so that you can test the custom schematics on an Angular project\n\n## Test Schematics on Demo App\n\n## Test the `Component` Command\n\n- Run `ng g ds-schematics:component --name=checkbox --standalone` to generate a standalone checkbox component\n\n```bash\nCREATE src/app/checkbox/checkbox.component.scss (0 bytes)\nCREATE src/app/checkbox/checkbox.component.html (0 bytes)\nCREATE src/app/checkbox/checkbox.component.spec.ts (613 bytes)\nCREATE src/app/checkbox/checkbox.component.ts (263 bytes)\n```\n\n- Run `ng g ds-schematics:component --name=checkbox` to generate a component that is part of the AppModule\n\n```bash\nCREATE src/app/checkbox/checkbox.component.scss (0 bytes)\nCREATE src/app/checkbox/checkbox.component.html (0 bytes)\nCREATE src/app/checkbox/checkbox.component.spec.ts (613 bytes)\nCREATE src/app/checkbox/checkbox.component.ts (263 bytes)\nUPDATE src/app/app.module.ts (484 bytes)\n```\n\n## Test the `ng add` Command\n\n- Run `ng g ds-schematics:ng-add`\n- This command updates the npm script `test: jest` and install Jest as a dependency\n\n## FAQ\n\nQ: I saw this error `An unhandled exception occurred: Collection \"ds-schematics\" cannot be resolved.` when I'm running the schematics commands\n\nA: Run `npm link ds-schematics` in the `demo-app` folder again and should resolve this issue.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frangle%2Fcustom-angular-schematic-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frangle%2Fcustom-angular-schematic-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frangle%2Fcustom-angular-schematic-demo/lists"}