generate-react-component

0.1.6 • Public • Published

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.


## Usage

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.


### Generate Component (Class or Pure) with a CSS file

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.


That's it!

Enjoy and feel free to share your suggestion!

TODO

  • Add yarn add globalsupport
  • Add Chalk fancy colors

Readme

Keywords

none

Package Sidebar

Install

npm i generate-react-component

Weekly Downloads

6

Version

0.1.6

License

MIT

Last publish

Collaborators

  • jonexiu