Product
Introducing License Enforcement in Socket
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
code-gen-library
Advanced tools
[![npm version](https://badge.fury.io/js/code-gen-library.svg)](https://badge.fury.io/js/code-gen-library)
Stop worrying about the small things. A quick and opinionated way of generating code for your React projects 🏗
npm install --save-dev code-gen-library
npx generate
or if installed globally
generate
Once executed, The following message should appear
? [PLOP] Please choose a generator. (Use arrow keys)
❯ Component - Generate a React component ⚛️
Util - Generate a util function 🛠
The CLI will ask you for the following information
Command | Description | Default value
-- | -- | -- | --
Component name? | The name of your React component |
Do you want a separate file for styles? | If you want your styles to live outside the main component | ✅
Do you want a separate file for models | If you want your models to live outside the component of the folder | ✅
If we choose the component name to be input text
and everything else goes to default we end up with.
✔ ++ /path/to/your/repo/src/components/InputText/InputText.tsx
✔ ++ /path/to/your/repo/src/components/InputText/index.ts
✔ ++ /path/to/your/repo/src/components/InputText/InputText.styles.ts
✔ ++ /path/to/your/repo/src/components/InputText/InputText.models.ts
Command | Description | Default value
-- | -- | -- | --
Util name? | The name of your util function |
What path shall we put it in? (src/utils) | The path in which the new folder is going to be added in | src/utils
If we choose the component name to be date format
and everything else goes to default we end up with.
✔ ++ /path/to/your/repo/src/utils/dateFormat/dateFormat.ts
✔ ++ /path/to/your/repo/src/utils/dateFormat/index.ts
Right now you might be wondering.
What if I don't use TypeScript? What if I don't want to be asked every time if styles should be separate files? ...
All of these are very valid concerns and part of the reason why I decided to make this library. For those of you who want more customisation, a config file can be added with your preferences.
Create a cgl.config.js
file on the root of your repo.
Here is some more information about what can be customised
Rule | Description | Default value |
---|---|---|
componentsPath | The path where the components will be put | src/components/ |
jsx | If the main component will be .jsx / .tsx or .js / .ts | true |
utilsPath | The default path for the utils | src/utils/ |
withModels | Models to be separated from the main component. Models files will suffix with .models.* | true |
withStyles | Styles to be separated from the main component. Styles files will suffix with .styles.* | true |
withTests | File for tests to also be included in the same directory. WIll suffix with .test.* format | true |
withTypescript | All files will be generated with TypeScript .ts / .tsx format | true |
Check out this link for reasoning and inspiration behind code-gen-library
FAQs
[![npm version](https://badge.fury.io/js/code-gen-library.svg)](https://badge.fury.io/js/code-gen-library)
We found that code-gen-library demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
Product
We're launching a new set of license analysis and compliance features for analyzing, managing, and complying with licenses across a range of supported languages and ecosystems.
Product
We're excited to introduce Socket Optimize, a powerful CLI command to secure open source dependencies with tested, optimized package overrides.