A simple react component template generating tool
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
template
utils
.editorconfig
.gitignore
CHANGELOG.md
README.md
command.js
create-react-component.js
index.js
package.json
yarn.lock

README.md

create-react-component

A react component template generating tool

Save the trouble copy paste and rename when creating new react component

Support js ts css module styled components ...

Usage

  1. install: npm install -g @isaac.js/create-react-component
  2. use: create-react-component [-Options] MyComponent

Output

Runing create-react-component -m MyComponent will generate a directory in the current working directory

MyComponent/

  - MyComponent.tsx(or .jsx)

  - MyComponent.scss(this file is removed when you use styled components)

  - index.ts(or .js)

Options

-l, --language [LANG]

Specify language(default to ts):

ts: typescript

js: javascript

-t, --type [TYPE]

Specify component type(default to c):

c: React.Component

p: React.PureComponent

s: React.SFC(Stateless Functional Component)

-m

Specify whether to use css module or not, use css module if -m present

Note that if option -s present, this option is ignored!

-s

Specify whether to use styled components, use styled components if -s present

Template

Template for Component.scss

this file is removed when you use styled components

@charset 'utf-8';
.MyComponent {

}

Template for Component.tsx

import * as React from 'react'
import cStyle from './MyComponent.scss'

type MyComponentProps = {}
type MyComponentState = {}

export class MyComponent extends React.Component<MyComponentProps, MyComponentState> {
  public render() {
    return (
      <div className={cStyle.MyComponent}>MyComponent</div>
    )
  }
}

Template for index.ts

import { MyComponent } from './MyComponent'
export default MyComponent