实现Changeset Version Management:Claude Code 实战指南
学习如何implement Changeset-based version management and automatic CHANGELOG generation:Claude Code 实战. Covers monorepo support, CI integration, and release flow design.
Changesetで体系的なバージョン管理を実現する
Changesetは、包のバージョン管理とCHANGELOG生成を自动化するツールです。尤其モノレポ環境で威力を発揮し、包間の依存関係を考慮した一貫性のある发布フローを构建可以。Claude Code 配置からCI联动まで的確にサポートします。
初期セットアップ
让 Claude Codeセットアップを依頼吧。
> Changesetをモノレポ项目に引入して。
> GitHub Actionsでの自動发布、CHANGELOG生成を含めて。
# インストール
npm install -D @changesets/cli @changesets/changelog-github
# 初期化
npx changeset init
// .changeset/config.json
{
"$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
"changelog": [
"@changesets/changelog-github",
{ "repo": "your-org/your-repo" }
],
"commit": false,
"fixed": [],
"linked": [],
"access": "public",
"baseBranch": "main",
"updateInternalDependencies": "patch",
"ignore": [],
"___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
"onlyUpdatePeerDependentsWhenOutOfRange": true
}
}
Changesetの创建
更改内容を記述するChangeset文件の创建方法です。
# インタラクティブにChangesetを作成
npx changeset
<!-- .changeset/happy-dogs-fly.md -->
---
"@myapp/ui": minor
"@myapp/utils": patch
---
ボタンコンポーネントにバリアント「outline」を追加しました。
ユーティリティ関数の型定義を改善しました。
让 Claude CodeChangeset创建を依頼するプロンプト例です。
> 今回の更改に対するChangeset创建。
> @myapp/uiにminorバージョンの更改、説明文も書いて。
npm scriptsの配置
// package.json
{
"scripts": {
"changeset": "changeset",
"changeset:status": "changeset status",
"version": "changeset version",
"release": "changeset publish",
"prerelease": "npm run build"
}
}
GitHub Actionsでの自動发布
PRマージ時に自動でバージョンアップPRを创建し、マージ後にnpmへ公開する工作流です。
# .github/workflows/release.yml
name: Release
on:
push:
branches: [main]
concurrency: ${{ github.workflow }}-${{ github.ref }}
permissions:
contents: write
pull-requests: write
packages: write
jobs:
release:
name: Release
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: 20
registry-url: "https://registry.npmjs.org"
- run: npm ci
- run: npm run build
- name: Create Release Pull Request or Publish
id: changesets
uses: changesets/action@v1
with:
version: npm run version
publish: npm run release
title: "chore: バージョンアップ"
commit: "chore: バージョンアップ"
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
モノレポでの高度な配置
包間の联动を管理する配置パターンです。
// .changeset/config.json
{
"changelog": [
"@changesets/changelog-github",
{ "repo": "your-org/your-repo" }
],
"commit": false,
"fixed": [
["@myapp/core", "@myapp/cli"]
],
"linked": [
["@myapp/ui", "@myapp/theme"]
],
"access": "public",
"baseBranch": "main",
"updateInternalDependencies": "patch"
}
- fixed - 常に同じバージョンになる包グループ
- linked - バージョンが連動して上がる包グループ
プレ发布の管理
ベータ版やRC版の发布フローです。
# プレリリースモードに入る
npx changeset pre enter beta
# Changesetを追加
npx changeset
# プレリリースバージョンを適用
npx changeset version
# => 1.0.0 -> 1.1.0-beta.0
# 公開
npx changeset publish
# プレリリースモードを終了
npx changeset pre exit
Changesetの验证
PRにChangesetが含まれているかをCIでチェックする工作流です。
# .github/workflows/changeset-check.yml
name: Changeset Check
on:
pull_request:
branches: [main]
jobs:
changeset-check:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
with:
fetch-depth: 0
- uses: actions/setup-node@v4
with:
node-version: 20
- run: npm ci
- name: Check for changeset
run: npx changeset status --since=origin/main
カスタムCHANGELOGフォーマット
CHANGELOG の输出を自定义するパターンです。
// .changeset/changelog-config.ts
import type { ChangelogFunctions } from "@changesets/types";
const changelogFunctions: ChangelogFunctions = {
getDependencyReleaseLine: async () => "",
getReleaseLine: async (changeset, type) => {
const [firstLine, ...rest] = changeset.summary
.split("\n")
.map((l) => l.trimEnd());
const date = new Date().toISOString().slice(0, 10);
let returnVal = `- ${firstLine}`;
if (rest.length > 0) {
returnVal += `\n${rest.map((l) => ` ${l}`).join("\n")}`;
}
return returnVal;
},
};
export default changelogFunctions;
总结
Changesetは体系的なバージョン管理と发布フローを自动化するための強力なツールです。Claude Codeを活用すれば、初期配置からCI联动、モノレポ支持まで高效地构建是可能的。
モノレポの管理手法はモノレポ管理指南を、CI/CD流水线の设计はCI/CDセットアップ指南。Changesets官方文档也建议确认一下。
Related Posts
Claude Code Hooks 完全指南:自动格式化、自动测试等实用配置
详解如何通过 Claude Code Hooks 实现自动格式化和自动测试。包含实际配置示例和真实使用场景。
Claude Code MCP Server 配置指南与实战用例
全面介绍 Claude Code 的 MCP Server 功能。从外部工具连接、服务器配置到真实集成案例,一文掌握 MCP 生态。
CLAUDE.md 编写完全指南:项目配置最佳实践
深入讲解如何编写高效的 CLAUDE.md 文件。学会向 Claude Code 传达你的技术栈、规范和项目结构,最大化输出质量。