ANTIGRAVITY LABEN
記事一覧/アプリ開発
アプリ開発/2026-03-31中級

Antigravity × npm パッケージ開発ガイド — AI エージェントで TypeScript ライブラリの作成・テスト・公開を自動化する

Antigravity の AI エージェントを活用して TypeScript npm パッケージを効率的に開発・テスト・公開する方法を解説。プロジェクト初期化からCI/CD連携まで網羅します。

antigravity435npm5typescript26package-developmentnodejs3open-source3

取り組みの背景 — なぜ AI IDE で npm パッケージを作るのか

npm レジストリには 200 万を超えるパッケージが公開されています。自分だけのユーティリティライブラリや OSS ツールを公開したいと考えている方も多いのではないでしょうか。しかし、TypeScript のビルド設定やテストの整備、バージョン管理、公開作業など、ライブラリ開発特有のボイラープレートに手間取ることも少なくありません。

Antigravity の AI エージェントを活用すれば、こうした定型作業を大幅に自動化できます。プロジェクトの初期スキャフォールディングから型定義の生成、テストケースの自動作成、そして npm publish に至るまで、エージェントと対話しながら効率よく進めることが可能です。

プロジェクトの初期化 — AI にスキャフォールディングを任せる

Antigravity でまず行うのは、エージェントにプロジェクトの骨組みを作ってもらうことです。ターミナルまたはチャットパネルから以下のように指示します。

TypeScript npm パッケージのプロジェクトを作成してください。
- パッケージ名: @myorg/utils
- ESM + CJS デュアル出力
- tsup でバンドル
- vitest でテスト
- biome でリント&フォーマット

エージェントは以下のようなディレクトリ構成を自動生成します。

@myorg/utils/
├── src/
   └── index.ts          # エントリポイント
├── tests/
   └── index.test.ts     # テストファイル
├── tsconfig.json          # TypeScript 設定
├── tsup.config.ts         # バンドル設定(ESM + CJS)
├── vitest.config.ts       # テスト設定
├── biome.json             # リント&フォーマット設定
├── package.json           # npm メタデータ
├── README.md              # ドキュメント
├── LICENSE                # ライセンスファイル
└── .gitignore

ポイントは、tsup を使って ESM と CommonJS の両形式でビルドする構成を最初から用意してもらう点です。これにより、モダンな import 文と従来の require() のどちらからでも利用できるライブラリになります。

package.json の設計 — exports フィールドを正しく構成する

npm パッケージで最も重要なのは package.json の構成です。AI エージェントに依頼すると、以下のような最適な設定を生成してくれます。

{
  "name": "@myorg/utils",
  "version": "0.1.0",
  "type": "module",
  "main": "./dist/index.cjs",
  "module": "./dist/index.js",
  "types": "./dist/index.d.ts",
  "exports": {
    ".": {
      "import": {
        "types": "./dist/index.d.ts",
        "default": "./dist/index.js"
      },
      "require": {
        "types": "./dist/index.d.cts",
        "default": "./dist/index.cjs"
      }
    }
  },
  "files": ["dist", "README.md", "LICENSE"],
  "scripts": {
    "build": "tsup",
    "test": "vitest run",
    "test:watch": "vitest",
    "lint": "biome check .",
    "prepublishOnly": "npm run build && npm run test"
  }
}

exports フィールドの conditional exports を使うことで、Node.js のバージョンやモジュールシステムに応じて適切なファイルが解決されます。types を各条件の先頭に配置するのは TypeScript の型解決を正しく動作させるためのベストプラクティスです。

Antigravity のエージェントはこうした細かな仕様にも対応してくれるため、手動で調べる時間を大幅に節約できます。

tsup によるビルド設定 — ESM と CJS のデュアル出力

tsup は TypeScript ライブラリのバンドルに特化したツールで、設定が簡潔です。

// tsup.config.ts
import { defineConfig } from "tsup";
 
export default defineConfig({
  entry: ["src/index.ts"],
  format: ["esm", "cjs"],    // デュアル出力
  dts: true,                  // 型定義ファイルを自動生成
  splitting: false,
  sourcemap: true,
  clean: true,                // ビルド前に dist/ をクリーン
  outDir: "dist",
  target: "es2022",
  minify: false,              // ライブラリは minify しないのが一般的
});

ビルドは以下のコマンドで実行できます。

# ビルド実行
npx tsup
 
# 出力結果の確認
# dist/index.js     — ESM 形式
# dist/index.cjs    — CommonJS 形式
# dist/index.d.ts   — 型定義
# dist/index.d.cts  — CJS 用型定義

Antigravity のエージェントに「ビルドして結果を確認して」と依頼するだけで、ビルドの実行とファイル生成の検証まで自動で行ってくれます。

AI によるテストケースの自動生成

ライブラリ開発では、公開 API の信頼性を保証するテストが欠かせません。Antigravity のエージェントは実装コードを読み取り、エッジケースを含むテストを自動生成します。

たとえば、以下のようなユーティリティ関数があるとします。

// src/index.ts
export function slugify(text: string): string {
  return text
    .toLowerCase()
    .trim()
    .replace(/[^\w\s-]/g, "")
    .replace(/[\s_]+/g, "-")
    .replace(/-+/g, "-")
    .replace(/^-|-$/g, "");
}
 
export function truncate(str: string, maxLength: number, suffix = "..."): string {
  if (str.length <= maxLength) return str;
  return str.slice(0, maxLength - suffix.length) + suffix;
}
 
export function groupBy<T>(arr: T[], key: keyof T): Record<string, T[]> {
  return arr.reduce((acc, item) => {
    const group = String(item[key]);
    (acc[group] ??= []).push(item);
    return acc;
  }, {} as Record<string, T[]>);
}

エージェントに「src/index.ts のテストを作成して」と指示すると、以下のようなテストが生成されます。

// tests/index.test.ts
import { describe, it, expect } from "vitest";
import { slugify, truncate, groupBy } from "../src/index";
 
describe("slugify", () => {
  it("基本的な文字列をスラッグに変換する", () => {
    expect(slugify("Hello World")).toBe("hello-world");
  });
 
  it("特殊文字を除去する", () => {
    expect(slugify("Hello, World! @2026")).toBe("hello-world-2026");
  });
 
  it("先頭と末尾のハイフンを除去する", () => {
    expect(slugify("  --hello--  ")).toBe("hello");
  });
 
  it("空文字列を処理する", () => {
    expect(slugify("")).toBe("");
  });
 
  it("連続するスペースをハイフン1つにまとめる", () => {
    expect(slugify("a   b   c")).toBe("a-b-c");
  });
});
 
describe("truncate", () => {
  it("上限以下の文字列はそのまま返す", () => {
    expect(truncate("short", 10)).toBe("short");
  });
 
  it("上限を超えた文字列を切り詰める", () => {
    expect(truncate("this is a long sentence", 10)).toBe("this is...");
  });
 
  it("カスタム suffix を適用する", () => {
    expect(truncate("abcdefghij", 8, "…")).toBe("abcdefg…");
  });
});
 
describe("groupBy", () => {
  it("指定キーでグループ化する", () => {
    const data = [
      { category: "a", value: 1 },
      { category: "b", value: 2 },
      { category: "a", value: 3 },
    ];
    const result = groupBy(data, "category");
    expect(result.a).toHaveLength(2);
    expect(result.b).toHaveLength(1);
  });
 
  it("空配列は空オブジェクトを返す", () => {
    expect(groupBy([], "key" as never)).toEqual({});
  });
});

テストの実行もエージェントに任せることができます。vitest run を実行してもらい、全テストがパスすることを確認しましょう。テスト駆動開発(TDD)のアプローチに興味がある方は、Antigravity × TDD テスト自動化ガイド も参考になります。

バージョン管理と CHANGELOG の自動化

パッケージの公開にあたって、セマンティックバージョニング(semver)に従ったバージョン管理が重要です。Antigravity のエージェントを使えば、変更内容の分析からバージョンバンプの判断、CHANGELOG の更新まで一連の作業を自動化できます。

# エージェントへの指示例
「最新のコミット履歴を確認して、semver に基づいたバージョンバンプを提案してください。
CHANGELOG.md Keep a Changelog 形式で更新してください。」

エージェントはコミットメッセージを分析し、以下のように判断してくれます。

  • fix: パッチバージョン(0.1.0 → 0.1.1)
  • feat: マイナーバージョン(0.1.0 → 0.2.0)
  • BREAKING CHANGE: メジャーバージョン(0.1.0 → 1.0.0)

生成される CHANGELOG は以下のような形式です。

## [0.2.0] - 2026-03-31
 
### Added
- `groupBy` ユーティリティ関数を追加
- ESM + CJS デュアル出力に対応
 
### Fixed
- `slugify` で連続ハイフンが残る問題を修正

npm publish — 公開前チェックと実行

パッケージを公開する前に、Antigravity のエージェントに最終チェックを依頼しましょう。

公開前の最終チェックを行ってください。
- package.json の files フィールドが正しいか
- dist/ にビルド成果物があるか
- README.md が存在し、使い方の説明があるか
- LICENSE ファイルが存在するか
- npm pack --dry-run で含まれるファイルを確認

エージェントは npm pack --dry-run を実行し、パッケージに含まれるファイル一覧を確認してくれます。

# 公開前の確認コマンド
npm pack --dry-run
 
# 出力例:
# npm notice Tarball Contents
# npm notice 1.2kB  dist/index.js
# npm notice 1.0kB  dist/index.cjs
# npm notice 892B   dist/index.d.ts
# npm notice 892B   dist/index.d.cts
# npm notice 2.1kB  README.md
# npm notice 1.1kB  LICENSE
# npm notice 580B   package.json
# npm notice Tarball Details
# npm notice name:          @myorg/utils
# npm notice version:       0.2.0
# npm notice package size:  3.2 kB

問題がなければ、以下のコマンドで公開します。

# npm にログイン(初回のみ)
npm login
 
# 公開(スコープ付きパッケージの場合は --access public を指定)
npm publish --access public

package.jsonprepublishOnly スクリプトにより、公開前に自動でビルドとテストが実行されるため、壊れた状態のパッケージが公開されるリスクを軽減できます。

CI/CD との連携 — GitHub Actions で自動公開する

手動で npm publish を実行する方法だけでなく、GitHub Actions を使った自動公開パイプラインを構築すると、さらに効率的です。Antigravity のエージェントに「GitHub Actions で npm パッケージを自動公開するワークフローを作成して」と依頼すると、以下のような設定を生成してくれます。

# .github/workflows/publish.yml
name: Publish Package
 
on:
  release:
    types: [published]
 
jobs:
  publish:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      id-token: write
    steps:
      - uses: actions/checkout@v4
 
      - uses: actions/setup-node@v4
        with:
          node-version: "22"
          registry-url: "https://registry.npmjs.org"
 
      - run: npm ci
      - run: npm run lint
      - run: npm run test
      - run: npm run build
 
      - run: npm publish --provenance --access public
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

--provenance フラグを付けることで、npm のサプライチェーンセキュリティ機能(provenance attestations)に対応し、パッケージの信頼性を高めることができます。

より高度な CI/CD パイプラインの構築方法については、Antigravity × GitHub Actions 上級CI/CDパイプライン構築ガイド で詳しく解説しています。

まとめ

Antigravity の AI エージェントを活用することで、TypeScript npm パッケージの開発サイクル全体を効率化できます。プロジェクトの初期化、package.json の最適な構成、テストケースの自動生成、バージョン管理、そして CI/CD 経由の自動公開まで、エージェントと協力しながら進めることで、ライブラリ開発者はコアロジックの設計と実装に集中できるようになります。

ぜひ Antigravity でお気に入りのユーティリティを npm パッケージとして公開し、開発コミュニティに貢献してみてください。

シェア

お読みいただきありがとうございます

Antigravity Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • コピー&ペーストで使える実装コード付き
  • 毎日新しい上級ガイドを追加
  • ¥580/月 または ¥1,480 の永久アクセス
メンバーシップを見る →

もしこの記事がお役に立ちましたら、チップ(¥150)で応援いただけると大変励みになります。広告なしでの運営を続けるため、皆さまのご支援が大きな力になっています。

関連記事

アプリ開発2026-07-02
依存パッケージの更新を月イチの苦行にしない — エージェントに任せる週次アップデートのリスク分類と検証ゲート
溜まった依存更新をまとめて当てて壊す運用から、semverとパッケージ種別のリスク分類で週次に消化する運用へ。Antigravityエージェントに渡すプレイブックと検証ゲートの実装をまとめます。
アプリ開発2026-05-03
Antigravity × TypeScript で作る冪等性キーと重複排除ストア本番設計ガイド
Stripe Webhook の二重課金や Temporal ワークフローの再実行で起きる重複処理を、冪等性キーと重複排除ストアで止める本番設計を、Antigravity を伴走者にして TypeScript で組み上げる実践ガイドです。
アプリ開発2026-05-01
Antigravity で React Server Components の境界を整理する — Next.js 16 で迷わなくなるワークフロー
Server / Client の境界判断は Next.js 16 で最も詰まりやすいポイントです。Antigravity を境界設計のレビュアーとして使い、`use client` の貼り間違いとシリアライズエラーをゼロに近づける個人開発の実践ワークフローを共有します。
📚RECOMMENDED BOOKS
大規模言語モデル入門
山田育矢
LLM開発
生成AIプロンプトエンジニアリング入門
我妻幸長
プロンプト
Claude CodeによるAI駆動開発入門
平川知秀
AI駆動開発
※ アフィリエイトリンクを含みます
もっと見る →