メインコンテンツまでスキップ

Visual Studio Code のセットアップ

本章では、新規作成・移行したプロジェクトを VSCode で開き、必要な設定を行い、実際にユーザモジュールをビルドするところまで を解説します。

プロジェクトを VSCode で開く​

次のいずれかの方法でプロジェクトを開きます。

  • VSCode のメニューから開く: VSCode を起動 → メニューから File → Open Folder... を選択 → プロジェクトのルートフォルダを選択。

  • コマンドラインから開く: プロジェクトのルートディレクトリで次のコマンドを実行。

    code .

拡張機能のインストール​

VSCode の左サイドバーの Extensions アイコン（四角が組み合わさったアイコン）を開き、利用したい拡張機能をインストールしてください。 詳細は公式ドキュメント https://code.visualstudio.com/docs/getstarted/extensions を参照してください。

intra-mart Accel Platform の開発を支援する拡張機能

プロジェクトの作成・管理、サーバへのデプロイ、サーバサイドスクリプトのデバッグとテストを VSCode の画面から行える拡張機能を提供しています。詳細は Visual Studio Code の活用 を参照してください。

エージェント向けのセットアップ​

VSCode の拡張機能からエージェントを利用する場合は、エージェントに応じてサインインを行います。

GitHub Copilot の場合​

  1. VSCode 左下のアカウントアイコンをクリックし、Copilot にアクセス可能な GitHub アカウントで VSCode にサインインします。

詳細な手順は公式ドキュメント https://code.visualstudio.com/docs/copilot/setup を参照してください。

Claude Code の場合​

  1. Claude Code 拡張機能が未インストールの場合は、公式ドキュメント https://code.claude.com/docs/en/vs-code の手順に従って VSCode の Extensions からインストールします。
  2. インストール後、拡張機能を起動し、Anthropic アカウントでサインインします。

詳細は公式ドキュメント https://code.claude.com/docs/en/vs-code を参照してください。

OpenAI Codex の場合​

  1. OpenAI Codex 拡張機能が未インストールの場合は、公式ドキュメント https://developers.openai.com/codex/quickstart?setup=ide の手順に従って VSCode の Extensions からインストールします。
  2. インストール後、拡張機能を起動し、ChatGPT アカウントまたは API キーでサインインします。

詳細は公式ドキュメント https://developers.openai.com/codex を参照してください。

依存関係のインストールとビルド​

VSCode の 統合ターミナル（メニューから Terminal → New Terminal、もしくは Ctrl + ` / Control + `）を開き、次の順にコマンドを実行します。

依存関係のインストール​

bun install

このコマンドは package.json に記載された依存関係を取得します。完了すると node_modules/ ディレクトリが生成されます。

ユーザモジュールのビルド​

bun run build

package.json の build スクリプト（内部的に Maven を呼び出す）が実行され、ユーザモジュールが生成されます。

作業完了確認: ビルドが正常に完了すると、最終行付近に BUILD SUCCESS の表示や成果物の出力先が示されます。

生成されるユーザモジュールについて

e Builder で作成される imm ファイルは、target フォルダ配下に生成された <アーティファクト名>-<バージョン>.zip というファイルの拡張子を .imm にリネームしたものです。 target 配下に生成された <アーティファクト名>-<バージョン>.zip は、imm ファイルと同様にユーザモジュールとして使用できます。

成果物のデプロイについて（参考）​

ビルドで生成したユーザモジュールは、IM-Juggling を使って WAR ファイルに組み込み、iAP にデプロイします。詳細手順は公式ドキュメントを参照してください。

Docker を利用した iAP 開発環境の活用について

iAP の開発・検証環境は、Docker を使ってローカル PC 上に構築できます。 Docker を利用することで、Resin・データベース・Solr などのミドルウェアを個別にインストールすることなく、短時間で iAP 開発環境を構築できます。 また、環境の再現性も高いため、メンバー間での環境差分を最小化できます。

Docker による iAP 環境の構築手順については、intra-mart Accel Platform 開発環境セットアップガイド（Docker 編） を参照してください。

Accel CLI を利用したデプロイについて

iAP の開発・検証環境に対して、Accel CLI を使ってデプロイを行うことが可能です。 ホットデプロイに対応しており、WAR ファイルを作成せずにユーザモジュールをデプロイできます。

下記コマンドによりデプロイが可能です。

# 初回のみ: 開発環境の URL と API キーを登録
bunx @intra-mart/accel login

# デプロイ
bunx @intra-mart/accel deploy

詳細はデプロイ資材転送を参照してください。

VSCode を使いこなすための補足（初学者向け）​

機能説明開き方
アクティビティバー左端の縦に並んだアイコン。ファイル一覧、検索、ソース管理、拡張機能、デバッグ等を切り替える。常に表示
コマンドパレットあらゆる機能をコマンド名で実行する入り口。Ctrl + Shift + P（Windows/Linux）、Shift + Command + P（macOS）
統合ターミナルVSCode 内でシェルを開いてコマンドを実行できる。Ctrl + `（Windows/Linux）、Control + `（macOS）
エクスプローラープロジェクトのファイルツリーを表示する。アクティビティバーの一番上のアイコン
VSCode のセットアップで問題が発生したときは

トラブルシューティング の「CLI 実行・動作確認関連」セクションを参照してください。