@chollenbeck/ngx-appworks-schematics v4.3.1
NGX Appworks Schematics
Summary
Angular schematics designed to work with a homebrewed Angular seed project. Most operations adhere to the standard /src/app directory flow, but some files such as services make use of shared resources not included in this package.
Schematics included for both RESTful API and Google's Firebase platform. Both schematics share the same interface schematic, but have seperate form, list, manage, and service configurations.
Issues
Please submit any and all issues/enhancements to Github. I monitor the repo multiple times a week and usually respond to requests within a few days.
Versions
Please use the following versions based on which AppWorks Core Template is being used. If your current version is now explicitely shown, use the closest version number of the last digit that does not exceed your version. i.e. 11.160.2
should use 4.0.0
AppWorks Core | NGX |
---|---|
11.160.3 | 4.1.0 |
11.160.1 | 4.0.0 |
Depreciated
Due to naming convention, previous schematics had to be renamed. Use @chollenbeck/ngc for v3.15 or lower | AppWorks Core | NGC | |----------------|-----------| | 1.11.0 | 3.15.x | | 1.5.2 | <= 3.14.x |
Installation
This package is best used a dev dependency and can be installed via NPM with the following command:
npm install --save-dev @chollenbeck/ngx-appworks-schematics@latest
Recommended package.json scripts
The double hash on the end of the script allows arguments to apply to the ng g
action vs the npm run
action. Add/Remove functions and rename as needed.
"scripts": {
"ngc:form": "ng g @chollenbeck/ngc:component-form-subscription -- ",
"ngc:table": "ng g @chollenbeck/ngc:component-table -- ",
"ngc:c": "ng g @chollenbeck/ngc:component -- ",
"ngc:ce": "ng g @chollenbeck/ngc:component-export -- ",
"ngc:list:fire": "ng g @chollenbeck/ngc:component-list-firebase --",
"ngc:list:http": "ng g @chollenbeck/ngc:component-list-http --",
"ngc:manage:fire": "ng g @chollenbeck/ngc:component-manage-firebase --",
"ngc:manage:http": "ng g @chollenbeck/ngc:component-manage-http --",
"ngc:f:http": "ng g @chollenbeck/ngc:feature-http --",
"ngc:f:fire": "ng g @chollenbeck/ngc:feature-firebase --",
"ngc:i": "ng g @chollenbeck/ngc:interface --",
"ngc:s:http": "ng g @chollenbeck/ngc:service-http -- ",
"ngc:s:fire": "ng g @chollenbeck/ngc:service-http -- ",
"ngc:s:fire": "ng g @chollenbeck/ngc:service-firebase --
}
Versioning
This package uses symantic versioning and follows these guidelines:
- Major | Newly added schematic or removal of an existing schematic.
- Minor | Schematic functionality tweaks to templates or chained schematics. May include renaming of schematics which will BREAK previous versions.
- Patch | Bugfix or non functional enhancements such as comments or syntax fixes in templates.
Schematics List
Each schematic is run with space separated arguments and includes prompts for any missing arguments. The only required argument is the module name, which can be used to autofill the rest of the prompts with a blank entry (press enter with no input).
Component and Service schematics have two flavors to cover RESTful API integrations and Firebase Cloud Platform.
- Module
- Model
- C.R.U.D Feature
- Component Blank
- Component Table
- Component Form
- Component List
- Component Manage
- Service
Firebase vs RESTful API flavors
Firebase | RESTful | |
---|---|---|
Entity ID type | STRING | NUMBER |
Service Call | Observable/Promise | Promise |
Module & Routing
Generates a new folder and module file under /src/app/+feature. The +
character is added automatically to the module folder name upon generation. The new module folder also contains a routes folder for component route configurations.
Example: npm run ngc:module my-feature
CREATE /src/app/+my-feature/my-feature.module.ts
CREATE /src/app/+my-feature/routes/my-feature.routes.module.ts
CREATE /src/app/+my-feature/routes/my-feature.routes.names.ts
Interface
Generates a .ts file with the {interface-name}.model.ts
naming convention in a models
folder inside the designated feature folder.
Example: npm run ngc:class my-feature interface-name
CREATE /src/app/+my-feature/models/interface-name.model.ts
Component
A blank component with a few default services added to the constructor. Also registers the component with the module and routes files if they exist. This does not generate any spec/test files or scss unlike the standard angular schematic.
Example: npm run ngc:component my-feature my-component
CREATE /src/app/+my-feature/+my-component/my-component.component.ts
CREATE /src/app/+my-feature/+my-component/my-component.component.html
UPDATE /src/app/+my-feature/routes/my-feature.routes.module.ts
UPDATE /src/app/+my-feature/routes/my-feature.routes.names.ts
UPDATE /src/app/+my-feature/my-feature.module.ts
Service
A mostly blank service that extends an IService interface for OOP re-use vs generating the same boilerplate code for each feature. The generated file also includes the super() call with default values. Services are all decorated with providedIn: root
.
Example: npm run ngc:service my-feature my-service
CREATE /src/app/+my-feature/services/my-service.service.ts