CLI tool that makes react boilerplate component. Supports es6 or typescript, css or @emotion/styled, emmet-like syntax.

Related tags

Boilerplate compg
Overview

compg

CLI tool that makes react boilerplate component. Supports es6 or typescript, css or @emotion/styled, emmet-like syntax.

compg example

Installation

npm i compg -g

Usage

compg

Simple run.

compg ComponentName

Run with preinstalled component.

AnotherComponentName"">
compg "ComponentName>AnotherComponentName"

Create two components with parent-child connection.

AnotherComponentName"">
compg --syntax=typescript --style=emotion "ComponentName>AnotherComponentName"

Run with options.

Child>Toy+AnotherToy^(AnotherChild>Candy)+YetAnotherChild"">
compg -tm "Parent>Child>Toy+AnotherToy^(AnotherChild>Candy)+YetAnotherChild"

Run with short options and more complex connection.

ComponentName

The syntax is inherited from emmet. There are several operators available >, +, ^, ().

Available Options

  • -h, --help: Show this help message and exit.
  • --syntax: Syntax, valid values: typescript, es6.
  • --style: Style, valid values: emotion, css.
  • -t: Use typescript. Alias for --syntax=typescript.
  • -e: Use es6. Alias for --syntax=es6.
  • -m: Use @emotion/styled. Alias for --style=emotion.
  • -c: Use css. Alias for --style=css.
You might also like...
Large SPA boilerplate use react redux webpack babel es6 express browsync nodemon...

React-workflow Why Large SPA application is hard to design, because a lot of things need to consider The boilerplate had solved the difficulty for

Starter template for Vite with React (TypeScript). Supports Tailwind with CSS-Modules. Jest and @react/testing-library configured and ready to go. Also ESLint, Prettier, Husky, Commit-lint and Atomic Design for components.
Starter template for Vite with React (TypeScript). Supports Tailwind with CSS-Modules. Jest and @react/testing-library configured and ready to go. Also ESLint, Prettier, Husky, Commit-lint and Atomic Design for components.

Mocking up web app with Vital(speed) Live Demo Features ⚡️ React 17 🦾 TypeScript, of course 🫀 Jest - unitary testing made easy 🎨 Tailwind with JIT

A developer blog starter for 2021 (Next.js + React + TypeScript + Markdown + syntax highlighting)

Devii A developer blog starter for 2020. Next.js React TypeScript Markdown syntax highlighting SEO RSS generation if you're happy and you know it, sta

Template for developing react app with structure inspired by Ignite CLI's react native boilerplate

React Template A react template heavily inspired by Ignite CLI's boilerplate for React Native, it uses a couple of generators with simple template cus

Template for developing react app with structure inspired by Ignite CLI's react native boilerplate

React Template A react template heavily inspired by Ignite CLI's boilerplate for React Native, it uses a couple of generators with simple template cus

Agrippa is a humble CLI, whose purpose is to assist React developers in creating components without the boilerplate.

Agrippa is a humble CLI, whose purpose is to assist React developers in creating components without the boilerplate. It can easily generate te

💥A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.
💥A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

💥A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

React Server Component for syntax highlighting

React Server Component for syntax highlighting

A boilerplate for Vite.js, React.js, Styled-Components, & TypeScript with Styling reset.

VRST Boilerplate ⚡ Vrst stands for Vite, React, Styed-Components, TypeScript. It's fast & faster than create-react-app! 🏃‍♂️ Installation Choose an o

Owner
Malakhov Mikhail
Malakhov Mikhail
A CLI tool to clean out boilerplate code created by create-react-app

Clean React Clean React is a CLI tool that removes and modifies some of the boilerplate files and code that are being generated when initiating a new

Meike Hankewicz 14 Nov 2, 2022
Boilerplate for creating React component libraries, bundled with Rollup.js to ES6 Modules, React Styleguidist, Typescript

Boilerplate for creating React component libraries, bundled with Rollup.js to ES6 Modules, React Styleguidist, Typescript

Kai Hotz 233 Nov 5, 2022
hopify boilerplate for embedded apps. Built and re-written from the official Shopify CLI's app boilerplate

Shopify boilerplate for embedded apps. Built and re-written from the official Shopify CLI's app boilerplate, but moved it to Typescript, and more modularized, so you can use any frontend framework you want. I left it comes by default, with React.

Leonel Aimar 9 Nov 21, 2022
Free-from-jsx.macro - Babel macro that allows you to use a flutter like render syntax

Free-from-jsx.macro - Babel macro that allows you to use a flutter like render syntax

Gabriel Rohden 3 Jul 7, 2022
A cli tool to generate cra-template from current create-react-app project.

Create Cra Template A cli tool to generate cra-template from current create-react-app project. Create Cra Template Templates cra-template-popular cra-

Yoki 23 Aug 18, 2022
The New CLI tool explicitly for react.

Reactli (under development) The New CLI tool explicitly for react. This is a CLI tool similar to @angular/cli. The main purpose of this is, to create

Dulranga Dhawanitha 2 Jun 23, 2022
Mg-project-template - A cli tool for creating a template project

Proyect Template CLI Tool A cli tool for creating a template project Quick Overv

Marcelo Garcia 3 Mar 10, 2022
A CLI tool for quickly creating my own Vue3 template and React18-template

vgt Description A CLI tool for quickly creating my own Vue3 template and React18-template. ?? I build it just for fun, it is still in progress. ?? And

Cupid Valentine 4 Nov 12, 2022
A boilerplate of SPA, built with React.js, Webpack, ES6+, Redux, Router, Babel, Express, Ant Design...

Getting start Clone this repo: $ git clone https://github.com/jovey-zheng/react-start-kit.git Install dependenices: $ npm i Start the project: $ npm

Jovey Zheng 109 Mar 1, 2022
Large SPA boilerplate use react redux webpack babel es6 express browsync nodemon...

React-workflow Why Large SPA application is hard to design, because a lot of things need to consider The boilerplate had solved the difficulty for

云霜儿 66 Mar 27, 2021