Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-cli-snippets

assaf.fink471.2.6

React CLI snippets for creating TypeScript Functional Components, Class Components, Services, Models, Utils and more.

react, react.js, cli, snippet, snippets, typescript, component, components, functional component, class component

readme

react-cli-snippets

CLI Commands for creating the following React entities using TypeScript syntax:

  • Functional Component
  • Class Component
  • Model class
  • Service class
  • Utility class

Installation:

npm i -g react-cli-snippets

CLI Commands:

create fc Kitten creates a Functional Component.
create fc Kitten --scss creates a Functional Component using SCSS.
create fc Kitten --module creates a Functional Component using CSS-Module.
create fc Kitten --props creates a Functional Component with Props.
create fc Kitten --scss --props creates a Functional Component with Props, using SCSS.
create fc Kitten --module --props creates a Functional Component with Props, using CSS-Module.
create cc Kitten creates a Class Component.
create cc Kitten --props creates a Class Component with Props.
create cc Kitten --state creates a Class Component with State.
create cc Kitten --props --state creates a Class Component with Props and State.
create util KittenUtil creates a Util Class.
create model KittenModel creates a Model Class.
create service KittenService creates a Service Class.
create --help displays this help page.
create --version displays version.

Directories & Files:

Each component contains a .tsx and .css or .scss or .module.css file.
The components are created by default inside ./src/Components folder.
To create a component directly inside ./src folder instead, prefix it with a forward slash.
The utils are created by default inside ./src/Utils folder.
To create a util directly inside ./src folder instead, prefix it with a forward slash.
The models are created by default inside ./src/Models folder.
To create a model directly inside ./src folder instead, prefix it with a forward slash.
The services are created by default inside ./src/Services folder.
To create a service directly inside ./src folder instead, prefix it with a forward slash.
Examples:
create fc Kitten creates the component in ./src/Components/Kitten folder.
create fc /Kitten creates the component in ./src/Kitten folder.
create util KittenUtil creates the util in ./src/Services folder.
create util /KittenUtil creates the util in ./src folder.
create model KittenModel creates the model in ./src/Models folder.
create model /KittenModel creates the model in ./src folder.
create service KittenService creates the service in ./src/Services folder.
create service /KittenService creates the service in ./src folder.

Happy Programming 😎