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