TypeScript Nx Plugin

統合されたModel Context Protocol (MCP)サーバーを備えた完全なTypeScript Nx Pluginを生成します。このジェネレーターは、AIアシスタントによる自動コード生成とプロジェクトスキャフォールディングにシームレスに使用できるカスタムジェネレーターを構築するための基盤を作成します。

使用方法

Nxプラグインを生成する

TypeScript Nxプラグインは2つの方法で生成できます：

CLI

pnpm

pnpm nx g @aws/nx-plugin:ts#nx-plugin

yarn

yarn nx g @aws/nx-plugin:ts#nx-plugin

npm

npx nx g @aws/nx-plugin:ts#nx-plugin

bun

bunx nx g @aws/nx-plugin:ts#nx-plugin

変更されるファイルを確認するためにドライランを実行することもできます

pnpm

pnpm nx g @aws/nx-plugin:ts#nx-plugin --dry-run

yarn

yarn nx g @aws/nx-plugin:ts#nx-plugin --dry-run

npm

npx nx g @aws/nx-plugin:ts#nx-plugin --dry-run

bun

bunx nx g @aws/nx-plugin:ts#nx-plugin --dry-run

VSCode

1. インストール Nx Console VSCode Plugin まだインストールしていない場合
2. VSCodeでNxコンソールを開く
3. クリック Generate (UI) "Common Nx Commands"セクションで
4. 検索 @aws/nx-plugin - ts#nx-plugin
5. 必須パラメータを入力
6. クリック Generate

オプション

パラメータ	型	デフォルト	説明
name 必須	string	-	TypeScriptプロジェクト名
directory	string	packages	ライブラリが配置される親ディレクトリ
subDirectory	string	-	ライブラリが配置されるサブディレクトリ。デフォルトではライブラリ名になります。
preferInstallDependencies	boolean	true	ジェネレーター実行後に依存関係のインストールを優先するかどうか。複数のジェネレーターをバッチ処理する際にインストールを延期する場合は false に設定します（後続のジェネレーターが Nx プロジェクトグラフを計算できるよう、必要に応じてインストールは実行されます）。最後に一度だけインストールします。

ジェネレーターの出力

ジェネレーターは以下のプロジェクト構造を作成します：

• Directoryyour-plugin/

  • Directorysrc/

    • index.ts Empty entry point for your plugin
    • Directorymcp-server/

      • index.ts Exports your server
      • server.ts Main MCP server configuration
      • stdio.ts Entry point for your MCP server with STDIO transport
      • http.ts Entry point for your MCP server with Streamable HTTP transport
      • Directorytools/

        • create-workspace-command.ts Tool for workspace creation guidance
        • general-guidance.ts Tool for general Nx and plugin guidance
        • list-generators.ts Tool to list available generators
        • generator-guide.ts Tool for detailed generator information
      • utils.ts Utility functions for the MCP server
  • generators.json Nx generator configuration (initially empty)
  • package.json Plugin package configuration
  • tsconfig.json TypeScript configuration (CommonJS for Nx compatibility)
  • project.json Nx project configuration with build and package targets

Nxプラグインの操作

ジェネレーターの追加

プラグインプロジェクトを作成したら、ts#nx-generatorジェネレーターを使用してジェネレーターを追加できます：

CLI

pnpm

pnpm nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin

yarn

yarn nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin

npm

npx nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin

bun

bunx nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin

変更されるファイルを確認するためにドライランを実行することもできます

pnpm

pnpm nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin --dry-run

yarn

yarn nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin --dry-run

npm

npx nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin --dry-run

bun

bunx nx g @aws/nx-plugin:ts#nx-generator --project=your-plugin --dry-run

VSCode

1. インストール Nx Console VSCode Plugin まだインストールしていない場合
2. VSCodeでNxコンソールを開く
3. クリック Generate (UI) "Common Nx Commands"セクションで
4. 検索 @aws/nx-plugin - ts#nx-generator
5. 必須パラメータを入力
   • project: your-plugin
6. クリック Generate

これにより、プラグインに新しいジェネレーターが追加されます。

ジェネレーターのドキュメント

ジェネレーターの実装方法の詳細については、ts#nx-generatorガイドをお読みください。

MCPサーバーのgenerator-guideツールで使用されるため、ジェネレーター用に詳細なREADME.mdを必ず記述してください。

プロジェクトターゲット

生成されたプラグインには、いくつかの重要なターゲットが含まれています：

ビルドターゲット

TypeScriptコードをコンパイルし、プラグインを使用できるように準備します：

pnpm

pnpm nx build your-plugin

yarn

yarn nx build your-plugin

npm

npx nx build your-plugin

bun

bunx nx build your-plugin

パッケージターゲット

NPM公開用の配布可能なパッケージを作成します：

pnpm

pnpm nx package your-plugin

yarn

yarn nx package your-plugin

npm

npx nx package your-plugin

bun

bunx nx package your-plugin

パッケージターゲットには、必要なすべてのアセットが含まれます：

• コンパイルされたJavaScriptファイル
• TypeScript宣言ファイル
• ジェネレーターとエグゼキューターの設定ファイル
• ドキュメントとライセンスファイル

MCPサーバーの統合

プラグインはts#mcp-serverジェネレーターを使用してMCPサーバーを設定します。

ツール

プラグインには、AIアシスタントに以下のツールを提供する完全なMCPサーバーが含まれています：

• general-guidance: Nxとプラグインでのベストプラクティスを取得
• create-workspace-command: プラグインを使用できる新しいワークスペースの作成方法を学習
• list-generators: プラグイン内の利用可能なすべてのジェネレーターをリスト
• generator-guide: スキーマと使用方法を含む特定のジェネレーターに関する詳細情報を取得

AIアシスタントでの設定

設定ファイル

MCP をサポートするほとんどの AI アシスタントは、同様の設定アプローチを使用します。MCP サーバーの詳細を含む設定ファイルを作成または更新する必要があります：

{
  "mcpServers": {
    "your-mcp-server": {
      "command": "npx",
      "args": ["tsx", "/path/to/your-mcp-server/stdio.ts"]
    }
  }
}

パス解決

サーバーへの接続時に ENOENT npx などのエラーが発生した場合、npx へのフルパスを指定する必要があるかもしれません。これはターミナルで which npx を実行することで取得できます。

ホットリロード

MCP サーバーを開発している間、AI アシスタントが常に最新バージョンのツール/リソースを認識できるように --watch フラグを設定することをお勧めします：

{
  "mcpServers": {
    "your-mcp-server": {
      "command": "npx",
      "args": ["tsx", "--watch", "/path/to/your-mcp-server/stdio.ts"]
    }
  }
}

ツールの更新

新しいツールやリソースを追加した場合、AI アシスタントで MCP サーバーを更新する必要があるかもしれません。

アシスタント固有の設定

特定の AI アシスタントで MCP を設定するには、以下のドキュメントを参照してください：

• Kiro
• Kiro CLI
• Claude Code
• Cursor
• Codex
• Cline
• Roo Code

ワークスペース設定

Kiro などの一部の AI アシスタントでは、ワークスペースレベルの MCP サーバー設定を指定できます。これは特定のプロジェクトに関連する MCP サーバーを定義する際に特に便利です。

MCPサーバーのカスタマイズ

server.tsを変更して、プラグインのドメインに固有の追加のツールやリソースを追加することで、MCPサーバーを拡張できます。

MCPサーバーの記述の詳細については、ts#mcp-serverガイドを参照してください。

プラグインの公開

公開の準備

1. パッケージ情報の更新: プラグインのpackage.jsonを適切な名前、バージョン、説明、リポジトリ情報で編集します。

2. パッケージのビルド:

   pnpm

   pnpm nx package your-plugin

   yarn

   yarn nx package your-plugin

   npm

   npx nx package your-plugin

   bun

   bunx nx package your-plugin

3. ローカルでのテスト: 別のワークスペースにインストールすることで、プラグインをローカルでテストできます：

   npm install /path/to/your/workspace/dist/your-plugin/package

NPMへの公開

プラグインの準備ができたら：

cd dist/your-plugin/package
npm publish

公開されたプラグインの使用

公開後、他のユーザーがプラグインをインストールして使用できます：

pnpm

pnpm add -w your-plugin-name

yarn

yarn add your-plugin-name

npm

npm install --legacy-peer-deps your-plugin-name

bun

bun add your-plugin-name

次に、ジェネレーターを使用します：

CLI

pnpm

pnpm nx g your-plugin-name:your-generator-name

yarn

yarn nx g your-plugin-name:your-generator-name

npm

npx nx g your-plugin-name:your-generator-name

bun

bunx nx g your-plugin-name:your-generator-name

変更されるファイルを確認するためにドライランを実行することもできます

pnpm

pnpm nx g your-plugin-name:your-generator-name --dry-run

yarn

yarn nx g your-plugin-name:your-generator-name --dry-run

npm

npx nx g your-plugin-name:your-generator-name --dry-run

bun

bunx nx g your-plugin-name:your-generator-name --dry-run

VSCode

1. インストール Nx Console VSCode Plugin まだインストールしていない場合
2. VSCodeでNxコンソールを開く
3. クリック Generate (UI) "Common Nx Commands"セクションで
4. 検索 your-plugin-name - your-generator-name
5. 必須パラメータを入力
6. クリック Generate

公開されたプラグインでAIアシスタントを設定する

公開されたプラグインのMCPサーバーは、次のように設定できます：

{
  "mcpServers": {
    "aws-nx-mcp": {
      "command": "npx",
      "args": ["-y", "-p", "your-plugin-name", "your-plugin-name-mcp-server"]
    }
  }
}