Schematics React
Schematics generators for React 🎊
Features
- 📜 Generates boilerplate
- 🎛️ Configurable
- 🛠️ Supports JavaScript & TypeScirpt
- 📦 Works with
create-react-app - 📌 Follows best pratices
Installation
-
npm:
npm install -g @angular-devkit/schematics-clinpm install --save-dev schematics-react -
yarn:
yarn global add @angular-devkit/schematics-cliyarn add -D schematics-react
Usage
schematics schematics-react:<generator name> <arguments>Available generators
Component
Creates a React component.
Example:
schematics schematics-react:component /src/components/myComponentwith alias:
schematics schematics-react:c /src/components/myComponentParameters
| Type | Name | Description | Default |
|---|---|---|---|
| required {string} | name | The name of the component. | none |
| {string} | path | The path to create the component | none |
| {string} | styleext | The file extension to be used for style files | 'css' |
| {boolean} | noSpec | Specifies if a spec file is generated | false |
| {boolean} | subfolder | Flag to indicate if a dir is created | false |
| {boolean} | propTypes | Specifies if a propTypes used | false |
| {boolean} | stateful | Specifies if a state used | false |
| {boolean} | ts | Specifies whether to use TypeScript | false |
Functional component
Creates a React component.
Example:
schematics schematics-react:functional-component /src/components/myComponentwith alias:
schematics schematics-react:fc /src/components/myComponentParameters
| Type | Name | Description | Default |
|---|---|---|---|
| required {string} | name | The name of the component. | none |
| {string} | path | The path to create the component | none |
| {string} | styleext | The file extension to be used for style files | 'css' |
| {boolean} | noSpec | Specifies if a spec file is generated | false |
| {boolean} | subfolder | Flag to indicate if a dir is created | false |
| {boolean} | propTypes | Specifies if a propTypes used | false |
| {boolean} | ts | Specifies whether to use TypeScript | false |