ヌクスト
RubyMine を使用すると、 Nuxt フレームワークを使って Vue.js アプリケーションを開発できます。 RubyMine で Nuxt アプリを設定する推奨方法は、 専用の Nuxt テンプレートを使用して新規プロジェクトウィザードを利用することです。
始める前に
Node.js バージョン 20 以降をダウンロードしてインストールします。
プロジェクトでローカル Node.js ランタイムが設定されていることを確認してください。 設定 ダイアログ（Ctrl+Alt+S ）を開き、 に進みます。 ノードランタイム フィールドにはプロジェクトのデフォルト Node.js ランタイムが表示されます。 Node.js インタープリターの設定の詳細を参照してください。
JavaScript and TypeScript、 JavaScript デバッガー、 Vue.js 必須プラグインが 設定 | プラグイン ページ、タブ インストール済み で有効化されていることを確認します。 詳細については、 プラグインの管理を参照してください。
Nuxt 固有のテンプレートからプロジェクトを作成する
ウェルカム 画面で 新規プロジェクト をクリックするか、メインメニューから を選択します。 新規 プロジェクト ダイアログが開きます。
左側のペインで、 ヌクスト を選択します。
右側のペインで：
プロジェクト関連ファイルが保存されるフォルダーへのパスを指定します。
ノードランタイム フィールドで使用する Node.js ランタイムを指定します。 リストから設定済みのランタイムを選択するか、 追加 を選択して新しいランタイムを設定してください。
Nuxt CLI リストから npx nuxi@ 最新 を選択し、 作成 をクリックします。
コマンドラインからプロジェクトを作成する
埋め込み ターミナル （Alt+F12 ）を開いて、次のように入力します。
npm create nuxt@latest <project-name>または
yarn create nuxt@latest <project-name>または
pnpm create nuxt@latest <project-name>ウィザードはあなたにいくつかの質問をします。 質問に回答すると、Nuxt プロジェクトが現在のフォルダーで初期化され、RubyMine ですぐ使えるようになります。
Nuxt 公式サイト(英語)の詳細を参照してください。
Nuxt 対応コーディング支援
RubyMine はコード補完を提案し、すべての コア Nuxt コンポーネントに対して クイックドキュメントを表示します。
RubyMine では、Nuxt コンポーネントの不足しているインポートステートメントをインポートすることも提案されます (Alt+Enter。
nuxt.config.ts を編集する
RubyMine は、 nuxt.config.ts 構成ファイル向けに適切な補完提案を提供します。
カーソルを合わせると、ファイルで使用されている Nuxt オプションの型情報を表示するドキュメントポップアップも確認できます。
型チェック
Nuxt 4 は完全な型付けが標準装備されています。 以前のバージョンの Nuxt では、より優れたコード補完を取得するには @nuxt /types パッケージが必要です。
Nuxt 公式サイト(英語)の詳細を参照してください。
@nuxt/types パッケージをインストールする
2.9.0 以降の Nuxt バージョンを利用していて、
@nuxt/typesパッケージがインストールされていない場合、RubyMine は通知し、開発依存関係としてインストールすることを提案します。 通知ポップアップ内の @nuxt/types を dev 依存関係としてインストールする リンクをクリックしてください。
ポップアップを閉じても、 イベントログ ツールウィンドウ（ ）の @nuxt/types を dev 依存関係としてインストールする リンクをクリックして
@nuxt/typesをインストールできます。または、埋め込まれた ターミナル （Alt+F12 ）を開き、次のように入力します。
npm install --save-dev @nuxt/types