Compass アプリケーションの Sass および SCSS
CLion の Compass サポートを利用すると、Compass アプリケーションの Sass または SCSS スタイルシートが自動で CSS にコンパイルされます。
始める前に
Compass および File Watchers プラグインを、 設定 | プラグイン ページの Marketplace タブで、 JetBrains Marketplace からのプラグインのインストールの説明に従ってインストールします。
Compass のインストール
コマンドライン シェルまたは組み込みの ターミナルエミュレータ （Alt+F12 ）で、次を入力します：
gem install compassCompass は、Ruby 実行ファイルと gem.bat ファイルが格納されているフォルダーにインストールされます。
新しい Compass アプリケーションの作成
Compass アプリケーションがまだない場合は、新規作成または空の CLion プロジェクトに Compass サポートを追加できます。 いずれの場合も、 conf.rb 構成ファイルが生成されます。
コマンドライン シェルまたは組み込みの ターミナルエミュレータ （Alt+F12 ）で、次を入力します：
compass create <the name of the application to be created>空の CLion プロジェクトを作成し、コマンドライン シェルまたは埋め込み ターミナルエミュレータ （Alt+F12 ）を開いて、次のように入力します：
cd <application folder> compass init
アプリケーションで Compass 対応のサポートをアクティブ化する
.sass または .scss ファイルを開く、
@import 'compass'ステートメントの横にある赤いバルブをクリックするか Alt+Enter を押してから、候補リストから Compass の設定 を選択します。Compass サポートを有効化 チェックボックスを選択し、Compass 実行ファイルと conf.rb 構成ファイルへのパスを指定します。
既存の Compass アプリケーションから開始する
すでにマシン上にあるアプリケーションソースを開く
ようこそ 画面で オープン をクリックするか、メインメニューから を選択します。 開いたダイアログで、ソースが保存されているフォルダーを選択します。
バージョン管理からアプリケーションのソースをチェックアウト
ようこそ 画面で リポジトリのクローン をクリックします。
あるいは、メインメニューから 、 、 を選択します。
メインメニューの Git の代わりに、プロジェクトに関連付けられている他のバージョン管理システムが表示される場合があります。 例: Mercurial または Perforce。
表示されるダイアログで、リストからバージョン管理システムを選択し、アプリケーションソースをチェックアウトするリポジトリを指定します。 詳細については、 プロジェクトのチェックアウト (クローン) を参照してください。
Sass と SCSS のコンパイル
コードを自動的にコンパイルするには、コンパイラーをインストールし、ファイルへの変更を追跡してコンパイラーを実行する Compass Sass または Compass SCSS File Watcher を構成する必要があります。
ファイルを開くと、CLion は現在のプロジェクトで適用可能な File Watcher が利用できるかどうかを確認します。 そのような File Watcher が構成されているが無効の場合、CLion は構成済みの File Watcher を通知し、有効化を提案するポップアップを表示します。
現在のプロジェクトで該当する File Watcher が構成され有効化されている場合、CLion は New Watcher dialogで指定されたイベントが発生すると自動的にコンパイラーを起動します。
編集したファイルを自動保存してウォッチャーをトリガーする チェックボックスが選択されている場合、ソースウォッチに変更が加えられるとすぐに File Watcher が呼び出されます。
編集したファイルを自動保存してウォッチャーをトリガーする チェックボックスがオフの場合、保存時（、 Ctrl+S ）または CLion からフォーカスを移動したとき（フレームの非アクティブ化時）に File Watcher が起動します。
詳細については、 File Watchers を参照してください。
CLion は生成した出力で別ファイルを作成します。 ファイルの名前はソース Sass または SCSS ファイルで、拡張子は .css です。 生成したファイルの保存場所は、 新規ウォッチャーダイアログの リフレッシュする出力パス フィールドで定義されています。 しかし、 プロジェクトツリー では、それらは現在ノードとして表示されているソースファイルに表示されます。
File Watcher を作成する
設定 ダイアログ（Ctrl+Alt+S ）で、 ツール の File Watchers をクリックします。 開く File Watchers ページには、構成済みのファイルウォッチャーのリストが表示されます。
をクリックするか、 Alt+Insert を押します。 使用するツールに応じて、リストから定義済みテンプレート compass sass または compass scss を選択します。 新規ウォッチャーダイアログが開きます。プログラム フィールドで、実行可能ファイルへのパスを指定します。
Windows 用 compass.bat
Unix 用 compass および macOS
引数 フィールドに、使用するオペレーティングシステムに応じて、次のいずれかを入力します。
ディレクトリ全体を処理する
compile $UnixSeparators($ProjectFileDir$)$1 つのファイルを処理する
compile $UnixSeparators($FilePath$)$
ディレクトリ全体を処理する
compile $ProjectFileDir$1 つのファイルを処理する
compile $ProjectFileDir$ $FilePath$
ディレクトリ全体を処理する
compile $ProjectFileDir$1 つのファイルを処理する
compile $ProjectFileDir$ $FilePath$
File Watchers に記載された手順に従って進めます。