generate-react-cli
A simple React CLI to generate components instantly and more.
Last updated 2 months ago by arminbro .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install generate-react-cli 
SYNC missed versions from official npm registry.

Generate React CLI

dependencies License

Why?

To help speed up productivity in React projects and stop copying, pasting, and renaming files each time you want to create a new component.

A few notes:

  • Now supports React TypeScript projects.
  • Supports two different component testing libraries - Testing Library and Enzyme - that work with Jest. We assume that you have these libraries already configured in your React project.
  • It follows grouping by feature because we believe when you look at a component, you should see all of its corresponding files (i.e., stylesheet, test, and component) under one folder with the component name. We feel this approach provides a better developer experience.

You can install it globally and run it using npm:

 npm i -g generate-react-cli
 generate-react component Box

Or you can just run it using npx like this:

 npx generate-react-cli component Box

(npx is a package runner tool that comes with npm 5.2+ and higher)

Config File

When you run generate-react-cli within your project the first time, it will ask you a series of questions to customize the cli for your project needs (this will create a "generate-react-cli.json" config file).

e.g. generate-react-cli.json

{
  "component": {
    "path": "src/components",
    "css": {
      "preprocessor": "css",
      "module": false,
      "withStyle": true
    },
    "test": {
      "library": "Testing Library",
      "withTest": true
    },
    "withStory": false,
    "withLazy": false
  },
  "usesTypeScript": false
}

Usage

Generate Component

 npx generate-react-cli component Box

This command will create a folder with your component name within your default (e.g. src/components) directory, and its corresponding files.

Example of the component files structure

|-- /src
    |-- /components
        |-- /Box
            |-- Box.js
            |-- Box.css
            |-- Box.test.js

Options

You can also override some of the generate-react-cli default config options for one-off commands. So for example, let's say you have set withTest to be true in your generate-react-cli config file. You can override it for that one-off command like this:

 npx generate-react-cli c Box --withTest=false

Or vice versa, if you have set withTest to be false you can do this:

 npx generate-react-cli c Box --withTest=true

Otherwise, if you don't pass any options, it will just use the default values from the generate-react-cli config file you have set.

Options Description Value Type
--path Value of the path where you want the component to be generated in (e.g. src/pages). String
--withStyle Creates a corresponding stylesheet file with this component. Boolean
--withTest Creates a corresponding test file with this component. Boolean
--withStory Creates a corresponding story file with this component. Boolean
--withLazy Creates a corresponding lazy file (a file that lazy-loads your component out of the box and enables code splitting) with this component. Boolean

License

Generate React CLI is open source software licensed as MIT.

Current Tags

  • 3.0.0                                ...           latest (2 months ago)

31 Versions

  • 3.0.0                                ...           2 months ago
  • 2.0.2                                ...           2 months ago
  • 2.0.1                                ...           2 months ago
  • 2.0.0                                ...           2 months ago
  • 1.7.5                                ...           3 months ago
  • 1.7.4                                ...           3 months ago
  • 1.7.3                                ...           3 months ago
  • 1.7.2                                ...           3 months ago
  • 1.7.1                                ...           3 months ago
  • 1.7.0                                ...           4 months ago
  • 1.6.2                                ...           5 months ago
  • 1.6.1                                ...           5 months ago
  • 1.5.9                                ...           5 months ago
  • 1.5.8                                ...           6 months ago
  • 1.5.7                                ...           6 months ago
  • 1.5.6                                ...           6 months ago
  • 1.5.5                                ...           6 months ago
  • 1.5.4                                ...           6 months ago
  • 1.5.3                                ...           6 months ago
  • 1.5.2                                ...           6 months ago
  • 1.5.1                                ...           6 months ago
  • 1.5.0                                ...           6 months ago
  • 1.4.1                                ...           6 months ago
  • 1.4.0                                ...           6 months ago
  • 1.3.3                                ...           6 months ago
  • 1.3.2                                ...           6 months ago
  • 1.3.1                                ...           6 months ago
  • 1.3.0                                ...           6 months ago
  • 1.2.0                                ...           6 months ago
  • 1.1.0                                ...           6 months ago
  • 1.0.0                                ...           7 months ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 62
Dependencies (7)
Dependents (0)
None

Copyright 2014 - 2017 © taobao.org |