CoffeeScript
IntelliJ IDEA では、JavaScript にコンパイルされる CoffeeScript(英語) を使用できます。 IntelliJ IDEA は *.coffee ファイルを認識し、それらに 
のマークを付けます。 CoffeeScript コードにブレークポイントを直接設定でき、IntelliJ IDEA はコンパイル中に生成されたソースマップを使用してブレークポイントを認識します。
IntelliJ IDEA は、キーワード、ラベル、変数、パラメーター、関数の補完を提案することにより、CoffeeScript コードの作成を支援します。 シンボルから宣言 Ctrl+B または実装 Ctrl+Alt+B に移動したり、名前 Ctrl+Alt+Shift+N のシンボルを検索したりできます。
IntelliJ IDEA の統合の CoffeeScript(英語) は JavaScript に CoffeeScript のコードを変換するコンパイラー。 このツールは、CoffeeScript コードと生成された JavaScript コードの行間の対応を設定する ソースマップ(英語)も作成するため、IntelliJ IDEA デバッガーは CoffeeScript コードのブレークポイントを認識して正しく処理します。
始める前に
Node.js をダウンロードしてインストールします。
JetBrains Marketplace からプラグインをインストールするに記載されている手順に従い、 設定 | プラグイン ページの Marketplace タブで、 CoffeeScript および File Watchers プラグインをインストールします。 プラグインは IntelliJ IDEA Ultimate でのみ利用できます。
CoffeeScript を JavaScript にコンパイルする
コードを自動的にコンパイルするには、ファイルへの変更を追跡してコンパイラーを実行する CoffeeScript ファイルウォッチャーを構成する必要があります。
ファイルを開くと、IntelliJ IDEA は現在のプロジェクトで適用可能な File Watcher が使用可能かどうかを確認します。 そのような File Watcher が構成されているが無効になっている場合、IntelliJ IDEA は構成されている File Watcher について通知し、有効にすることを提案するポップアップを表示します。
現在のプロジェクトで該当する File Watcher が構成され、有効になっている場合、IntelliJ IDEAは 新規ウォッチャーダイアログで指定されたイベントが発生すると自動的にコンパイラーを起動します。
編集したファイルを自動保存してウォッチャーをトリガーする チェックボックスが選択されている場合、ソースウォッチに変更が加えられるとすぐに File Watcher が呼び出されます。
編集したファイルを自動保存してウォッチャーをトリガーする チェックボックスをオフにすると、保存時 (、 Ctrl+S) または IntelliJ IDEA からフォーカスを移動したとき (フレームの非アクティブ化時) に File Watcher が開始されます。
File Watchers の詳細を参照してください。
コンパイラーは、生成された出力を別のファイルに保存します。 ファイルの名前はソース CoffeeScript ファイルと同じで、拡張子はコンパイラーの種類に応じて .js または .js.map になります。 生成されたファイルの場所は、 リフレッシュする出力パス フィールドの 新しいウォッチャー ダイアログ で定義されています。 この設定に基づいて、IntelliJ IDEA はコンパイラー出力を検出します。 ただし、 プロジェクト ツールウィンドウ（Alt+1 ）では、それらはソース coffee ファイルの下に表示され、このファイルはノードとして表示されます。
CoffeeScript コンパイラーをインストールする
埋め込まれた ターミナル （Alt+F12 ）で、次のいずれかのコマンドを入力します。
グローバルインストール用の
npm install --global coffeescriptCoffeeScript を 開発依存関係(英語)としてインストールする
npm install --save-dev coffeescriptCoffeeScript 公式 Web サイト(英語)の詳細を参照してください。
CoffeeScript ファイルウォッチャーを作成する
Ctrl+Alt+S を押して設定を開き、 を選択します。
をクリックするか、 Alt+Insert を押して、リストから CoffeeScript 定義済みテンプレートを選択します。 コードは JavaScript に翻訳され、生成された ソースマップ(英語)とともに提供されます。File Watchers に記載されている手順に従います。
コンパイラーの動作をカスタマイズする
IntelliJ IDEA を使用すると、コマンドラインモードで作業しているかのように、コンパイラーに引数を渡すことでコンパイラーを調整できます。 以下は、 CoffeeScript コンパイラーのデフォルトの出力場所をカスタマイズする例です。
次のフォルダー構造のプロジェクトがあるとします。
デフォルトの File Watcher では、生成されたファイルは元のファイルの子として表示されます。
このデフォルトの場所を変更して、生成されたファイルを別の JavaScript フォルダーに保存することができます。
生成されたすべてのファイルを出力 JavaScript フォルダーに保存する
CoffeeScript ファイルウォッチャーを作成します。
引数 フィールドに次のように入力します：
--map --compile -o $ProjectFileDir$/JavaScript $FileName$リフレッシュする出力パス フィールドに次のように入力します：
$ProjectFileDir$/JavaScript/$FileNameWithoutExtension$.js:$ProjectFileDir$/JavaScript/$FileNameWithoutExtension$.map:$FileNameWithoutExtension$.js.map
その結果、プロジェクトツリーは次のようになります。
生成されたファイルを、 app ノードの元の構造を繰り返すフォルダー構造に格納することもできます。
出力フォルダーに元のフォルダー構造を保持する
CoffeeScript ファイルウォッチャーを作成します。
引数 フィールドに次のように入力します：
--map --compile -o $ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$ $FileName$リフレッシュする出力パス フィールドに次のように入力します：
$ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.js:$ProjectFileDir$/JavaScript/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.map:$FileNameWithoutExtension$.js.map
その結果、プロジェクトツリーは次のようになります。
コンパイラーを実行せずにコンパイル結果をプレビューする
IntelliJ IDEA は実際にコンパイラーを実行せずに CoffeeScript コードの静的解析を実行し、専用の読み取り専用ビューアーで予測されるコンパイル出力を表示できます。
エディターで目的の CoffeeScript ファイルを開き、エディターの背景を右クリックします。
コンテキストメニューから を選択します。 プレビューは専用の読み取り専用ビューアーで開かれます。左ペインには元の CoffeeScript ソースコードが表示され、右ペインにはコンパイラーが実行時に生成する JavaScript コードが表示されます。
CoffeeScript の実行
IntelliJ IDEA で CoffeeScript を実行する方法は 2 つあります。
CoffeeScript コードを手動でコンパイルし、出力 JavaScript コードをあたかも Node.js アプリケーションのように実行します。
元の CoffeeScript コードを Node.js 実行構成で実行し、IntelliJ IDEA にその場でコンパイルします。
CoffeeScript を手動でコンパイルし、生成された JavaScript コードを実行する
Node.js の実行構成の作成を開始するを次の必須設定で使用します。
使用する Node.js エンジン。 デフォルトでは、このフィールドには、Node.js の構成中に JavaScript Runtime ページで指定されたランタイムへのパスが表示されます。
作業ディレクトリ フィールドには、起動する CoffeeScript ファイルから参照するファイルの場所を指定します（例: includes）。 このファイルが他のファイルを参照していない場合は、フィールドを空のままにしてください。
ノードアプリケーション JS ファイルへのパス フィールドに、コンパイル中に元の CoffeeScript ファイルから生成された JavaScript ファイルへの絶対パスを指定します。
設定を保存し、ダイアログで 実行 をクリックします。
あるいは、メインツールバーのリストから新しく作成した実行構成を選択し、
をクリックします。Node.js アプリケーションの実行の間に進みます。
実行中にオンザフライで CoffeeScript をコンパイルする
このモードでは、
coffeescriptパッケージの一部である register.js ファイルがプロジェクト内に配置されている必要があります。 CoffeeScript コンパイラーをインストールするの説明に従って、coffeescriptパッケージがローカルにインストールされていることを確認してください。エディターで開始 CoffeeScript ファイルを開くか、 プロジェクト ツールウィンドウ（Alt+1 ）で選択し、コンテキストメニューから を選択します。 IntelliJ IDEA は、自動的に生成された実行 / デバッグ構成でファイルを実行します。
または、コンテキストメニューから を選択し、開いた 実行 / デバッグ構成: Node.js ダイアログで次の必須設定を確認します：
使用する Node.js ランタイム。 関連するランタイム構成を選択するか、新しいランタイム構成を作成します。 デフォルトでは、このフィールドには、Node.js の構成中に JavaScript Runtime ページで指定されたランタイムへのパスが表示されます。
Linux および macOS の場合、この設定は、CoffeeScript コンパイラー実行ファイルへのパスから Node.js によって上書きされます。
「Node パラメーター 」フィールドに
--require coffeescript/registerと入力します。作業ディレクトリ フィールドで、アプリケーションの 作業ディレクトリ(英語)を指定します。 デフォルトでは、フィールドには プロジェクトのルートフォルダーが表示されます。
ファイル フィールドで、実行する CoffeeScript ファイルへのフルパスを指定します。
設定を保存し、ツールバーの
をクリックします。あるいは、メインツールバーのリストから新しく作成した実行構成を選択し、
をクリックします。Node.js アプリケーションの実行の間に進みます。
CoffeeScript のデバッグ
IntelliJ IDEA で CoffeeScript をデバッグするには、JavaScript コードに加えて生成された ソースマップが必要です。 ソースマップは、CoffeeScript コードと生成された JavaScript コードの行間の対応を設定します。これがない場合、ブレークポイントが正しく認識・処理されません。 JavaScript およびソースマップは、型が CoffeeScriptの File Watchers を使用して CoffeeScript コードを手動でコンパイルすることで生成されます。 その後、出力された JavaScript コードをあたかも Node.js アプリケーションのようにデバッグできます。
CoffeeScript のデバッグは、 ローカルモードでのみサポートされています。 つまり、IntelliJ IDEA は実行構成に従って Node.js エンジンとターゲットアプリケーションを起動し、セッションを完全に制御します。
Node.js アプリケーションのデバッグの詳細については、「Node.js の実行とデバッグ 」を参照してください。
CoffeeScript コードをデバッグする
必要に応じて、CoffeeScript コードに ブレークポイントを設定します。
タイプ CoffeeScript の File Watcher を使用する CoffeeScript コードを Javascript にコンパイルします。
Node.js の実行構成の作成を開始するを次の必須設定で使用します。
使用する Node.js エンジン。 デフォルトでは、このフィールドには、Node.js の構成中に JavaScript Runtime ページで指定されたランタイムへのパスが表示されます。
作業ディレクトリ フィールドには、起動する CoffeeScript ファイルから参照するファイルの場所を指定します（例: includes）。 このファイルが他のファイルを参照していない場合は、フィールドを空のままにしてください。
ノードアプリケーション JS ファイルへのパス フィールドに、コンパイル中に元の CoffeeScript ファイルから生成された JavaScript ファイルへの絶対パスを指定します。
設定を保存し、ツールバーの
をクリックします。
構文ハイライトの構成
好みや習慣に応じて、CoffeeScript 対応の構文のハイライトを設定できます。
設定 ダイアログ (Ctrl+Alt+S) で、 に進みます。
カラースキームを選択し、デフォルトから引き継がれたハイライト設定を受け入れるか、 色とフォント に記載された手順 に従ってカスタマイズしてください。