react-comp-gen

Generate React component boilerplate quickly with minimal typing.

Installation

From npm:

npm i -g react-comp-gen

Usage

$ react-comp-gen generate <type> <name> # generate a component
                                        # Default command
$ react-comp-gen generate function "a-component" --dir "./src/containers"
# Generate/gen/g can be omitted
$ rcg fn a-component -d "./src/containers"

Creating Stateless Functional Component AComponent in ~/Desktop/my-sweet-project/src/containers...

Configuration

By default, react-comp-gen will check for config files (.reactgenrc) in the working directory, then your home directory. These configs are not merged, and the local config wins if both are present. If you want to run rcg without checking config files, pass -N or --no-config. If you want to pass in the relative path to a config file, pass in -c="./my/local/config".

Sample config:

{
  "withCss": "scss",
  "useFlow": true
}

Arguments

• Type (Positional, Enum, Required):

  • The following inputs are valid as types:
    • f, F, fn, FN, func, function: Stateless Functional Component
    • c, C, comp, component: Class Component
    • pc, PC, purecomp, purecomponent: PureComponent

• Name (Positional, String, Required):

  • Component/File Names will be PascalCased:
    • "test-component" becomes "TestComponent"

• Dir (-d, --dir: String, Optional; Default: ./src/components):

  • This is where your component directory will be generated

• Use Flow (--use-flow: Boolean, Optional; Default: false):

  • Generate components with type definitions and flow file annotation (/* @flow */) at the top.

• Dry Run (--dry-run: Boolean, Optional; Default: false):

  • If true, components will be written to STDOUT instead of saved to disk.

• Force (-f, --force: Boolean, Optional; Default: false):

  • If true, CLI will not prompt before overwriting existing directories (dangerous)

• CSS (-s, --with-css: Enum, Optional; Default: css):

  • Enum: 'css' | 'sass' | 'scss' | 'less'

• Config (-c, --config: String, Optional):

  • Specify a config file path to look in other than ~ or ./

• No Config (--no-config: Boolean, Optional; Default: false):

  • Do not read config files, only read args from ARGV

Bugs, Pull Requests

https://github.com/pdeona/react-comp-gen