Web Component Generator
The Design System Web Component Generator is a project tool intended to assist developers with an easy to configure and execute Web Component development environment for the purpose of building custom elements for the Design System.
Install
It is suggested that this package be installed globally as to ensure quick and easy access to initializing new web components at will.
$ npm i @alaskaairux/ods-wc-generator -g
The ODS Web Component Generator is configured to ensure that you have the latest version of the generator prior to starting a new build project. You can also verify your installed version manually by running the following command.
$ npm list -g @alaskaairux/ods-wc-generator
Execute
The API of the npm generator is as follows:
ods-wc-generate --name [wc name] --dir [your dir]
Example
$ ods-wc-generate --name button --dir ./ods-button
API
variable | required | description |
---|---|---|
--name | Yes | Name of the web component you wish to build. ods is assumed, so only the proper name, e.g. button or checkbox
|
-- dir | No | Directory where the new custom element files will be created. If a directory is not provided, one using the --name variable will be created |
General documentation
Please see OrionStatelessComponents__docs for all information in regards to using and developing HTML custom elements with the Design System.
UI development browser support
For the most up to date information on UI development browser support, see ./docs/BROWSER_SUPPORT.md
Building a Custom element
Once the new development environment has been created, there are some conventions to follow to ensure the success of your new Custom Element. Please see the development documentation ODS Stateless Component Development Details