JetBrains IntelliJ プラットフォームの LESS CSS コンパイラー plugin_html/css_WEB-ITnose

LESS コンパイラーは、LESS ファイルを制御し、変更がある場合に自動的に CSS を作成できます。このコンポーネントは、IntelliJ IDEA 11+、PhpStorm 5+、および WebStorm 5+ プラットフォームでのみ使用できます。

再帰的ディレクトリ監視

1. LESS コンパイラーは、ディレクトリ (およびサブディレクトリ) で LESS ファイルへの変更を監視し、ファイルがエディターに保存されるとき (または、IDE の外部で変更されたことが IntelliJ によって検出されるとき) に、自動的に CSS にコンパイルします。 LESS ディレクトリは好きなだけ作成できます。コンパイルされた CSS ファイルが複数の場所 (バージョン管理下のローカル src ディレクトリやリモート サーバーにマウントされたターゲット ディレクトリなど) にコピーされるように、出力ディレクトリを好きなだけ指定することもできます。

   出力 CSS ディレクトリは、ソース LESS ディレクトリの構造と同一になります。

   @import 依存関係の解決

変更された LESS ファイルを @import したファイルは、自動的に再コンパイルされます。

2. たとえば、home.less の場合、 about.less、contact.less all @import "common.less" の場合、common.less を変更すると、3 つの依存ファイルもすべて再コンパイルされます。

   ファイル パターンを含める/除外する

特定の LESS ファイルが実行されないようにするファイル名、フォルダー名、または LESS ファイルへの完全なパスの一部と一致する包含/除外パターン (グロブ) を指定することによってコンパイルされます。

3. 移動、コピー、および削除の検出

LESS ファイルが移動されると、コピーまたは削除されると、LESS Compiler は、対応する CSS ファイルに対して同じことを行うよう提案します。

4. 仮想ファイルシステム通知

他のソリューションとは異なり、このプラグインは、CSS ファイルが変更または移動されたときに IntelliJ に通知するのに十分な機能を備えています。 、コピーまたは削除されました。ほとんどの場合、更新された CSS ファイルはエディターとプロジェクト ツリー ビューにすぐに反映されます。

5. 選択的コンパイル

プラグインが何らかの理由で LESS ファイルへの変更をキャッチできない場合は、エディターまたはプロジェクト内の任意の場所を右クリックするだけです。ツリーを開き、「CSS にコンパイル」を選択します。プロジェクト ツリーでディレクトリ全体を右クリックして、ディレクトリ全体をコンパイルすることもできます。

6. エラー通知

コンパイル プロセス中にエラーが発生すると、ファイルへのリンクを含むエラー通知バルーンが IDE に生成され、エラーの原因となった行番号