shelldandy / create-react-component-folder

Creates react component folder structure

Create React Component folder

About

Create React Component folder works on macOS, Windows, and Linux.
It creates React or React Native component folder structure with one command.
There is also support for Typescript, React Native, Less and Sass.

Quick Overview

$ npm install --save-dev create-react-component-folder
$ npx crcf myComponent

(npx comes with npm 5.2+ and higher, see instructions for older npm versions)

Tutorial

Read the artice on Medium

Installation

$ npm install --save-dev create-react-component-folder

Creating single component

$ npx crcf myComponent
$ npx crcf components/myComponent

Output single

Creating multiple components

$ npx crcf components/header footer button navigation

Output multiple

Component folder structure

myComponent
├── index.js
├── myComponent.js
├── myComponent.css
├── myComponent.test.js

Creating index.js file for multple component imports

$ npx crcf --createindex

Output in index.js file for multple component imports

Options

$ npx crcf --help

  Usage: index [options]

  Options:

    -V, --version     output the version number
    --typescript      Creates Typescript component and files
    --nocss           No css file
    --notest          No test file
    --reactnative     Creates React Native components
    --createindex     Creates index.js file for multple component imports
    -f, --functional  Creates React stateless functional component
    -j, --jsx         Creates the component file with .jsx extension
    -l, --less        Adds .less file to component
    -s, --scss        Adds .scss file to component
    -p, --proptypes   Adds prop-types to component
    -u, --uppercase   Component files start on uppercase letter
    -h, --help        output usage information

Author

• Snær Seljan Þóroddsson

License

MIT