{"slug": "how-to-setup-conventional-commits-in-javascript-project-2026-edition", "title": "How to setup Conventional Commits in JavaScript project: 2026 edition", "summary": "A developer has published an updated guide on setting up Conventional Commits in JavaScript projects for 2026, covering new tooling such as AI coding agents that write commits and release automation, Simple Release v3, and updated documentation websites for Conventional Changelog and Simple Release. The guide explains the Conventional Commits specification, its benefits for automated versioning and changelogs, and provides step-by-step instructions for tools like Commitlint and simple-git-hooks, including CI setup with GitHub Actions and monorepo scope configuration.", "body_md": "A year ago I published [the first edition of this guide](https://dangreen.blog/post/how-to-setup-conventional-commits-in-javascript-project/). Since then the tooling has moved forward: AI coding agents learned to write Conventional Commits and set up release automation through agent skills, Simple Release got v3, and both [Conventional Changelog](https://conventional-changelog.js.org/) and [Simple Release](https://simple-release.js.org/) got their own documentation websites. So here is the refreshed edition.\n\n[Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) is a specification for adding human and machine readable meaning to commit messages. It provides an easy set of rules for creating an explicit commit history, which makes it easier to write automated tools on top of.\n\nThe commit message should be structured as follows:\n\n```\n<type>[optional scope]: <description>\n\n[optional body]\n\n[optional footer(s)]\n```\n\nExamples:\n\n```\n# Feature addition\nfeat: add user authentication\n\n# Bug fix\nfix: resolve login redirect issue\n\n# Breaking change\nfeat!: migrate to new API endpoint\n\n# Also breaking change\nfeat: add new payment method\n\nBREAKING CHANGE: migrate to new payment gateway\n\n# With scope\nfeat(auth): add password reset functionality\n\n# With body and footer\nfix: prevent racing of requests\n\nIntroduce a request id and a reference to latest request. Dismiss\nincoming responses other than from latest request.\n\nCloses #123\n```\n\nConventional commits enable automatic semantic versioning:\n\nTools can automatically generate changelogs by parsing commit messages, grouping them by type, and extracting relevant information.\n\nConventional commits create a more readable and searchable project history, making it easier to understand what changes were made and why.\n\nTo achieve complete automation of versioning and releases, you'll need several tools working together. Let's set them up step by step.\n\nWhile not mandatory, [Commitlint](https://github.com/conventional-changelog/commitlint) helps enforce conventional commit standards by linting commit messages.\n\nFirst, install Commitlint and the Conventional Commits plugin:\n\n```\nnpm install --save-dev @commitlint/cli @commitlint/config-conventional\n```\n\nThen you need to set up a configuration.\n\nFor a basic project, create `.commitlintrc.json`\n\n:\n\n```\n{\n  \"extends\": [\"@commitlint/config-conventional\"]\n}\n```\n\nNow you can set up commit validation during `git commit`\n\n, for example using [simple-git-hooks](https://github.com/toplenboren/simple-git-hooks), though there are other similar tools available ([husky](https://github.com/typicode/husky), [pre-commit](https://github.com/observing/pre-commit), etc.).\n\nInstall simple-git-hooks:\n\n```\nnpm install --save-dev simple-git-hooks\n```\n\nCreate `.simple-git-hooks.json`\n\n:\n\n```\n{\n  \"commit-msg\": \"npx commitlint --edit \\\"$1\\\"\"\n}\n```\n\nNow run `npx simple-git-hooks`\n\nto activate the hooks and you're ready to go!\n\nYou can also set up commit linting via GitHub Actions when commits are pushed to the repository.\n\nCreate `.github/workflows/commit.yml`\n\n:\n\n```\nname: Commit Validation\n\non:\n  pull_request:\n    types: [opened, synchronize]\n\njobs:\n  commitlint:\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v7\n        with:\n          fetch-depth: 0\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v6\n        with:\n          node-version: 24\n          cache: 'npm'\n\n      - name: Install dependencies\n        run: npm ci\n\n      - name: Validate commit messages\n        run: npx commitlint --from=HEAD~1\n```\n\nIn monorepos, it's common practice to use scopes in Conventional Commits that correspond to workspace names in the monorepo. This helps identify which workspace(s) are affected by each commit. For example:\n\n```\nfeat(store): add user authentication state\nfix(ui): resolve button styling issue\ndocs(router): update routing configuration guide\n```\n\nYou can use specialized packages to automatically get project scopes:\n\nLet's look at an example for pnpm workspaces:\n\nInstall the packages:\n\n```\npnpm add -D @commitlint/cli @commitlint/config-conventional @commitlint/config-pnpm-scopes\n```\n\nCreate `.commitlintrc.js`\n\n:\n\n``` python\nimport scopes from '@commitlint/config-pnpm-scopes'\n\nexport default {\n  extends: ['@commitlint/config-conventional', '@commitlint/config-pnpm-scopes'],\n  rules: {\n    'scope-enum': async (ctx) => {\n      const scopeEnum = await scopes.rules['scope-enum'](ctx)\n      return [\n        scopeEnum[0],\n        scopeEnum[1],\n        [\n          ...scopeEnum[2],\n          'deps',     // for Dependabot or Renovate - dependency updates\n          'dev-deps', // for Dependabot or Renovate - dev dependency updates\n          'release'   // for release commits\n        ]\n      ]\n    }\n  },\n  prompt: {\n    settings: {\n      enableMultipleScopes: true\n    }\n  }\n}\n```\n\n[Commitizen](https://github.com/commitizen/cz-cli) is an optional but very convenient tool that provides an interactive CLI for creating Conventional Commits.\n\nFirst, install Commitizen and the Commitlint adapter:\n\n```\nnpm install --save-dev commitizen @commitlint/cz-commitlint\n```\n\nThen create `.czrc`\n\n:\n\n```\n{\n  \"path\": \"@commitlint/cz-commitlint\"\n}\n```\n\nAdd a script to `package.json`\n\n:\n\n```\n{\n  \"scripts\": {\n    \"commit\": \"cz\"\n  }\n}\n```\n\nNow you can use `npm run commit`\n\ninstead of `git commit`\n\nfor interactive commit creation.\n\nIf your team writes commits with an AI coding agent, the conventional-changelog project ships a universal [agent skill](https://conventional-changelog.js.org/getting-started/agent-skills/), `conventional-commit-message`\n\n, that teaches the agent to produce correct Conventional Commit messages - choosing the type and scope by release impact, flagging breaking changes, and validating against your Commitlint config when it is available.\n\nIt works with Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, and other agents that support the skills format. Install it with either package runner:\n\n```\n# pnpm\npnpx skills add conventional-changelog/conventional-changelog --skill conventional-commit-message\n# npm\nnpx skills add conventional-changelog/conventional-changelog --skill conventional-commit-message\n```\n\nFrom then on, asking the agent for a commit message yields a changelog-ready message that follows the same convention Commitlint enforces. See [Agent Skills](https://conventional-changelog.js.org/getting-started/agent-skills/) for the full details.\n\nThe [simple-release-action](https://github.com/marketplace/actions/simple-release-action) is a comprehensive GitHub Action that automates version updates, changelog generation, and releases. The project is based on [simple-release](https://github.com/TrigenSoftware/simple-release) and [conventional-changelog](https://github.com/conventional-changelog/conventional-changelog).\n\n*The setup described below can also be done for you by an AI coding agent: the setup-simple-release-action skill teaches the agent to detect your project type and toolchain, generate the config and workflow, and finish with a checklist of the repository settings only you can change.*\n\nKey Features:\n\nCurrently [npm](https://simple-release.js.org/project-types/npm/), [pnpm](https://simple-release.js.org/project-types/pnpm/), and [GitHub Actions](https://simple-release.js.org/project-types/github-action/) projects are supported.\n\nLet's look at an example of configuring the action for a project with pnpm workspaces using the [@simple-release/pnpm](https://simple-release.js.org/project-types/pnpm/) addon:\n\nCreate `.simple-release.json`\n\nconfig file in repository root:\n\n```\n{\n  \"project\": [\"@simple-release/pnpm#PnpmWorkspacesProject\", {\n    \"mode\": \"fixed\"\n  }],\n  \"bump\": {\n    \"extraScopes\": [\"deps\"]\n  }\n}\n```\n\n`extraScopes`\n\nis used to trigger version bump by commits like `fix(deps): ...`\n\nfrom Dependabot or Renovate.\n\nCreate `.github/workflows/release.yml`\n\n:\n\n```\nname: Release\n\non:\n  issue_comment:\n    types: [created, deleted]\n  push:\n    branches:\n      - main\n\njobs:\n  check:\n    runs-on: ubuntu-latest\n    name: Context check\n    outputs:\n      continue: ${{ steps.check.outputs.continue }}\n      workflow: ${{ steps.check.outputs.workflow }}\n    steps:\n      - name: Checkout the repository\n        uses: actions/checkout@v7\n      - name: Context check\n        id: check\n        uses: TrigenSoftware/simple-release-action@v2\n        with:\n          workflow: check\n          github-token: ${{ secrets.GITHUB_TOKEN }}\n\n  pull-request:\n    runs-on: ubuntu-latest\n    name: Pull request\n    needs: check\n    if: needs.check.outputs.workflow == 'pull-request'\n    steps:\n      - name: Checkout the repository\n        uses: actions/checkout@v7\n      - name: Create or update pull request\n        uses: TrigenSoftware/simple-release-action@v2\n        with:\n          workflow: pull-request\n          github-token: ${{ secrets.GITHUB_TOKEN }}\n\n  release:\n    runs-on: ubuntu-latest\n    name: Release\n    needs: check\n    if: needs.check.outputs.workflow == 'release'\n    steps:\n      - name: Checkout the repository\n        uses: actions/checkout@v7\n      - name: Install pnpm\n        uses: pnpm/action-setup@v6\n        with:\n          version: 10\n      - name: Install Node.js\n        uses: actions/setup-node@v6\n        with:\n          node-version: 24\n          cache: 'pnpm'\n          registry-url: 'https://registry.npmjs.org'\n      - name: Install dependencies\n        run: pnpm install\n      - name: Release\n        uses: TrigenSoftware/simple-release-action@v2\n        with:\n          workflow: release\n          github-token: ${{ secrets.GITHUB_TOKEN }}\n          npm-token: ${{ secrets.NPM_TOKEN }}\n```\n\nThis workflow consists of three jobs:\n\nEvery time you push to the main branch, the action will create or update a pull request with a version bump and updated changelog if necessary.\n\nWhen the pull request is merged, it will automatically release the project.\n\n*If you are not using GitHub, you can write your own custom CI script using the @simple-release/core package.*\n\nThere is also a recommendation to use squash merge for pull requests to keep the commit history in the main branch clean and well-structured. This ensures that each merge commit follows conventional commit standards and makes the project history more readable.\n\nBy implementing Conventional Commits with this toolchain, you'll have a fully automated release pipeline that maintains consistency, improves project history readability, and reduces manual overhead in version management.\n\nFor more details, guides and API references, check out the documentation websites: [conventional-changelog.js.org](https://conventional-changelog.js.org/) and [simple-release.js.org](https://simple-release.js.org/).\n\nIf you want to see real projects using Conventional Commits and their configurations, here are a few examples:", "url": "https://wpnews.pro/news/how-to-setup-conventional-commits-in-javascript-project-2026-edition", "canonical_source": "https://dev.to/dangreen/how-to-setup-conventional-commits-in-javascript-project-2026-edition-5gh", "published_at": "2026-07-14 14:12:22+00:00", "updated_at": "2026-07-14 14:30:16.238684+00:00", "lang": "en", "topics": ["developer-tools"], "entities": ["Conventional Commits", "Commitlint", "simple-git-hooks", "GitHub Actions", "Conventional Changelog", "Simple Release"], "alternates": {"html": "https://wpnews.pro/news/how-to-setup-conventional-commits-in-javascript-project-2026-edition", "markdown": "https://wpnews.pro/news/how-to-setup-conventional-commits-in-javascript-project-2026-edition.md", "text": "https://wpnews.pro/news/how-to-setup-conventional-commits-in-javascript-project-2026-edition.txt", "jsonld": "https://wpnews.pro/news/how-to-setup-conventional-commits-in-javascript-project-2026-edition.jsonld"}}