rcg-mc
v1.1.0
Published
RCG is a command-line utility for quickly generating React components with associated CSS files. It streamlines the process of component creation within a React project.
Downloads
5
Readme
React Component Generator (RCG)
RCG is a command-line utility for quickly generating React components with associated CSS files. It streamlines the process of component creation within a React project.
Installation
Ensure you have Node.js installed, and then run the following command to install RCG globally:
npm install -g rcg-mc
Usage
Navigate to the root of your React project and use the following syntax to create a new component:
rcg [options] componentName1 componentName2 ... componentNameN [*directoryName]
[Options]
- -scss: Change from CSS to SCSS for your component styles.
- -test: Generate a unit test file along with the component.
- -help: Show options and usage information.
Please note that if you create multiple components and add parameters such as -scss, all the components will be affected by this parameter.
[ComponentName]
The component name cannot contain special characters or spaces, and it must start with a letter. It will automatically capitalize the first letter of the component name, following React convention.
[DirectoryName]
To specify the directory name, use *
followed by the directory name.
If not specified, components will be created in the "components" directory.
By default, without any specified options, RCG will create components without test files and with CSS styles. Inside each component directory, two files will be created: ComponentName.jsx and ComponentName.css.
The order in which you write the commands will not affect functionality.
Example
rcg button
This will generate the following files:
/src
/components
/button
- button.jsx
- button.css
Example 2
rcg home about *pages
This will generate the following files:
/src
/pages
/home
- home.jsx
- home.css
/about
- about.jsx
- about.css
Example 3
rcg -scss -test Button
This will generate the following files:
/src
/components
/Button
- Button.jsx
- Button.scss
- button-test.js