create react component template with javascript/typescript


500.2.13 years ago3 years agoMinified + gzip package size for @isaac.js/create-react-component in KB



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 ...


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


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


  - MyComponent.tsx(or .jsx)

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

  - index.ts(or .js)


-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)


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

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


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


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

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.