composer

Single command project setup! This package automates essential tools for code style, version control, releases, and Docker.

NOTE: This package assists in setting up the following tools. You may click the links below to learn more about each tool.

| IDE | Development | Linting & Prettify | Version control | Deployment | | ----------------------------------------- | -------------------------------------------------- | ----------------------------------------------------------------------------- | ------------------------------------------ | ------------------------------------------------------ | | EditorConfig | TypeScript | ESLint@8.0.0 | commitlint | Docker | | | | lint-staged | Git | Release It | | | | Prettier | husky | |

NOTE: Currently fixed ESLint version at latest v8.0.0 due to the following reasons:

• ESLint v9 contains breaking API changes
• The eslint-plugin-react plugin is not compatible with ESLint v9

Table of Contents

• Prerequisite
• Installation
• Usage
• Options
  • Preset file
• Outputs
  • Docker
  • EditorConfig
  • Git
  • Husky
  • Prettier
  • release-it
  • commitlint
  • ESLint
  • lint-staged
  • TypeScript

Prerequisite

In order to use this package, you project must meet the following requirements:

• Contains a package.json file

# NPM
$ npm init

# PNPM
$ pnpm init

# Yarn
$ yarn init

• The directory is a git repository (In order to set up husky, commitlint, lint-staged, and Release It)

$ git init

Installation

Install the package as a dev dependency:

# NPM
$ npm install -D @chore-dev/composer

# PNPM
$ pnpm add -D @chore-dev/composer

# Yarn
$ yarn add -D @chore-dev/composer

Usage

1. Add the following script to your package.json file

You may skip this step if you are using PNPM or Yarn

{
  ...
  "scripts": {
    // ...existing scripts
    "composer": "composer"
  },
  ...
}

2. Run the following command to start the Composer:

# NPM
$ npm run composer [<options>]

# PNPM
$ pnpm composer [<options>]
or # If you have added the script to your `package.json` file
$ pnpm run composer [<options>]

# Yarn
$ yarn composer [<options>]
or # If you have added the script to your `package.json` file
$ yarn run composer [<options>]

Options

| Option | Alias | Description | Example | | ----------------------- | ----------------- | ------------------------------------------------- | ------------------------ | | --dry-run | -D | Run the command without making any changes | | | --no-backup | | Skip creating backup files while running composer | | | --preset path::string | -P path::string | Use a preset file and skip all questions | --preset ./preset.json |

Preset file

The preset file is a JSON file that contains the configuration for the Composer. The following is the structure of the preset file:

interface Preset {
  // Project environment
  env: Record<'isBrowser' | 'isNode', boolean>;
  framework: 'react' | 'vue' | 'none';
  packageManager: 'npm' | 'pnpm' | 'yarn';
  styleSheet: 'css' | 'scss' | 'none';
  withSyntaxExtension: boolean;
  // Tools
  commitLint: Record<'createConfig' | 'install' | 'integrate', boolean> | false;
  docker: Record<'addIgnores', boolean> | false;
  editorConfig: Record<'createConfig', boolean>;
  eslint: Record<'addIgnores' | 'createConfig' | 'insertScripts' | 'install', boolean> | false;
  git: Record<'addIgnores', boolean> | false;
  husky: Record<'insertScripts' | 'install', boolean> | false;
  lintStaged: Record<'createConfig' | 'install' | 'integrate', boolean> | false;
  prettier: Record<'addIgnores' | 'createConfig' | 'insertScripts' | 'install', boolean> | false;
  releaseIt: Record<'createConfig' | 'insertScripts' | 'install', boolean> | false;
  typescript: Record<'createConfig' | 'install', boolean> | false;
}

You may also copy the preset file from the Composer by running the following command:

# NPM
$ npm run composer --dry-run

# PNPM
$ pnpm composer --dry-run
or # If you have added the script to your `package.json` file
$ pnpm run composer --dry-run

# Yarn
$ yarn composer --dry-run
or # If you have added the script to your `package.json` file
$ yarn run composer --dry-run

Outputs

Composer may generate the following files according to the tools you have selected:

Click the items below to learn more about customizing them

commitlint

• commitlint.config.js

Docker

• .dockerignore

EditorConfig

• .editorconfig

ESLint

• eslint.config.js

Git

• .gitignore

Husky

• .husky (Directory)
  • .husky/commit-msg
  • .husky/pre-commit

lint-staged

• lint-staged.config.js

Prettier

• .prettier.config.js
• .prettierignore

release-it

• .release-it.json

TypeScript

• tsconfig.json

^ Back to top