Automatic Versioning Guide

About   |   Requirements   |   Configuration   |   Author

About

This is a quick guide on how to implement automatic semantic versioning using husky.js, commitlint, semantic release and github actions.

Requirements

• git
• node.js
• npm or yarn*

NOTE: If you choose to use npm, replace npm and npm run with yarn in the command to install dependencies and when executing the release script in the workflow.

Configuration

HuskyJS

1. Install husky

# npm
npm install --save-dev husky

# yarn
yarn add --dev husky

2. Setting up husky in project

npx husky init

Commitlint

1. Install commitlint 🔗

# npm
npm install --save-dev @commitlint/{cli,config-conventional}

# yarn
yarn add --dev @commitlint/{cli,config-conventional}

2. Configuration

echo "export default { extends: ['@commitlint/config-conventional'] };" > commitlint.config.js

3. Add hook

echo "npx --no -- commitlint --edit \$1" > .husky/commit-msg

Semantic Release

1. Install semantic-release

# npm
npm install --save-dev semantic-release

# yarn
yarn add --dev semantic-release

2. Install plugins 🔗

• Default plugins

  These four plugins are already part of semantic-release and are listed in order of execution. They do not have to be installed separately:

  • @semantic-release/commit-analyzer
  • @semantic-release/release-notes-generator
  • @semantic-release/npm
  • @semantic-release/github

• Additional plugins

# npm
npm install --save-dev @semantic-release/git @semantic-release/changelog

# yarn
yarn add --dev @semantic-release/git @semantic-release/changelog

3. semantic-release configuration 🔗

• Create a .releaserc file, written in YAML, with optional extensions: .yaml / .yml / .json / .js
• 📝 config file example
• edit package.json and add release script

// package.json

{
  ...
  "scripts": {
    ...
    "release": "semantic-release"
  }
  ...
}

4. Set up Continuous Integration 🔗

Create a workflow with Continuous Integration processes to be executed whenever a new change is sent to the main branch, see an example here.

Optional

Run linters against staged git files and don't let errors slip into your code base

1. Install lint-staged

# npm
npm install --save-dev lint-staged

#yarn
yarn add --dev lint-staged

2. Set up the pre-commit git hook to run lint-staged

echo "npx lint-staged" > .husky/pre-commit

3. Install some linters, like ESLint and Prettier

# prettier
# npm
npm install --save-dev --save-exact prettier

# yarn
yarn add --dev --exact prettier

# eslint
# npm
npm init @eslint/config@latest

# yarn
yarn create @eslint/config

4. Configure lint-staged to run linters and other tasks:

• see an example file