generate-react-component

An opinionated CLI generator for ReactJS components.

Why?

As a ReactJS developer, from time to time, I have to create components of same structure, by manual copy & paste. It is a time consuming no-brainer process that any React dev may repeat everyday.

Typically, there are two kinds of components: Functional and Class Components, the basic structure of either could always look the same, in one project:

Functional Component:

import React from 'react'

const Cmp = (props) => {
  return (
    <div className={s.cover} style={bgStyle} >
    </div>
  )
}

export default Cover

Class Component:

import React, { Component } from 'react'

class Cmp extends Component {
    componentDidMount() {
    }
    render() {
        return (
        )
    }
}

export default Cmp  

It should be a super easy tool to automatically generate these files, without manual new file creation or copy & paste. So, here you are.

Install

Run

npm install -g generate-react-component

You may need to sudo it.

Generate Class Component

Run

rcmp <ComponentName>

This will create a folder of your component name, and a Class Component js file with the same name.

Generate Pure Function Component

Run

rcmp <ComponentName> --pure

or

rcmp <ComponentName> -p

This will create a folder of your component name, and Pure Function Component js file of the same name.

Run

rcmp <ComponentName> --pure --css

or

rcmp <ComponentName> -p -c

This will create a folder of your component name, and component (Functional if --pure) js file of the same name, and a css file of the same name.

Enjoy and feel free to share your suggestion!

###TODO

• [ ] Add yarn add globalsupport
• [ ] Add Chalk fancy colors