Generate JS Components Script

Installation (global): npm i -g gc-component-generator

Description: This script automates the creation of JS components and associated CSS/SCSS & Test files. It reads configuration from a gc-config folder (if exists) to determine file extensions and templates for the JS and CSS files.

gc init > This command will generate gc-config directory

Configuration and templates:

// gc-config.json
{
  "js": "tsx",
  "css": "css", // "css": "scss"  > change ext
  "test": "test.js" // "test": ""  > don't generate
}

Template files: gc-js, gc-css, gc-test (can be personalized):

// gc-js.js
import './{{component_name}}.{{css_ext}}';

const {{component_name}} = () => {
  return (
    <div className="{{component_name}}">
      <h2>{{component_name}}</h2>
    </div>
  );
};

export default {{component_name}};

Usage Examples:

1. Generate a component in src/components: gc MyComponent

2. Generate a component in src/pages: gc pages/HomePage

3. Generate a component in src/screens (for React Native projects): gc screens/Profile