/schematics-react

Schematics generators for React

Primary LanguageTypeScriptMIT LicenseMIT

Schematics React

Build Status npm version npm

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-cli
    npm install --save-dev schematics-react
  • yarn:

    yarn global add @angular-devkit/schematics-cli
    yarn 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/myComponent

with alias:

schematics schematics-react:c /src/components/myComponent

Parameters

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/myComponent

with alias:

schematics schematics-react:fc /src/components/myComponent

Parameters

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