Clingon NPM | npm.io

Clingon CLI

Create components, functions, pages, and other files for your project with a few commands

Tired of creating components by hand? And still without any help from the VS Code interface or other IDEs?

Clingon comes to simplify this creation flow. You are going to create a React or Vue component, but this component needs a test file and a stories file (if you use storybook), with its entire structure being grouped or separated, it is a very tiring task to create all of this, add the code boilerplate (which I know you will copy from another ready-made file and change everything).

Let's simplify all of this, execute a command, answer some questions, or select your favorite template and that's it, everything is created, just start coding.

Description

Clingon is a command line tool that helps you create files for your project. By default, it already comes with some settings, which are commonly used concepts, and can offer you some known folder paths for common files, or ask you if you use TypeScript, what is the postfix for your test files, among other features that will help you be productive.

Answer a questionnaire with a few questions in guided mode (if you don't know exactly what you want, or if you're a beginner and need the code ready to start coding), or use advanced mode by selecting custom models that you created and added to the root of your project.

In the initial version, we have not yet made advanced mode available, it will be released in future updates.

How to use

Install the tool globally using your preferred Node package manager, or use npx to run the executable.

Note: Maybe on macOS you do not have permission to run the tool if you install it globally, if this happens you need to give the correct permissions or to avoid anything you can use npx which solves this problem.

Using npx
```
 npx clingon@latest gen
```

Using node package manager

Install

npm i -g clingon

# or

yarn add -g clingon

# or

pnpm i -g clingon

Execute
```
clingon gen
```

Features

This project is in beta stage (under development), so many of the expected features have not yet been implemented, if you want to contribute, check out the Contribution Guide

Opinionated resource generation
- Options
  - TypeScript
  - Unit Test
    - Postfix
      - .spec
      - .test
    - Testing Library
    - Test Framework
      - Jest
      - Vitest
  - Storybook Story
  - CSS Style
    - Vanilla CSS
    - CSS Modules
    - SASS/SCSS
    - TailwindCSS w/ @apply
    - TailwindCSS inline (inside class attr)
    - CSS-in-js
- Frameworks
  - Vue
    - Version
      - 2
      - 3
        Composition API
        Options API
    - Page
    - Component
    - Mixin
    - Filter
    - Hook
  - React
    - Component
    - Page
    - Hook
- Other resources
  - Function
  - Model
  - Enum
  - Type
  - Class
  - Story
  - Unit Test (.spec|.test)
Advanced resource generation
- Local custom templates
- Configuration file-based generation
- Generation based on existing files
- Composite dynamic generation (using several code snippets)