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