web-dev-qa-db-ja.com

PHPStormのFilewatcherコンパイラが少ない

PHPStorm File watcherを使用して.lessファイルを.cssにコンパイルしようとすると、何が間違っていますか?

これがスクリーンショットです(pls open THIS LINK 画像のフルサイズを表示するには): enter image description here

NodeJSをインストールした後、npm install -g lessをインストールしました。 cmd.exeを使用すると、コンパイラlesscは正常に動作します。WindowsOSのコマンドラインツールで次のコマンドを実行します。

lessc custom.less custom.cssですが、FilewatcherのPHPStorm内では何も実行されません。

私が修正すべき手がかりはありますか、pls?

13
aspirinemaga

IDE PHPStorm内でLESS自動コンパイラを構成したい場合は、次の方法で構成できます。

  1. ダウンロードしてインストール Node.js
  2. ターミナル/シェル/コマンドラインを開きます。Windows環境の場合はcmd.exe
  3. コマンドラインターミナル内で、npm install -g lessと入力し、LESSがダウンロードおよびインストールされるのを待ちます。
  4. PHPStormで[設定]ウィンドウを開きます:[ファイル]> [設定](CTRL + ALT + S)
  5. ファイルウォッチャーに移動します(または[設定]ウィンドウ内で検索します)
  6. [設定]ダイアログの右側にある+をクリックして、新しいファイルウォッチャーを作成し、図のように構成します。
    enter image description here
    これが、前の画像の設定でのフォルダー構造の外観です。
    enter image description here
  7. 保存してテストします。.lessファイル内に何かを入力するたびに、FileWatcherの設定ダイアログで以前に定義した.cssに自動的にコンパイルされます。
    ソースレスファイルのタッチを解除するには、図に示すようなtemplate.lessを作成し、スタイリングを行う前にソースファイルをそこにサブロードします。


/*!
 * Your commented code which wouldn't be removed in compiled .css because of "!" mark
 */
 /*
  * This comment will be removed in compiled .css file because of no "!" after "/*"
  */

// Core source files of Twitter's Bootstrap
@import "bootstrap/bootstrap";
@import "bootstrap/responsive";

// Core source file of Font Awesome Icons
@import "font-awesome/font-awesome";

// Connected plugins
@import "plugins/datepicker";
@import "plugins/redactor";

/*!
 * General template styles below
 */

/* -------------------------------------------------------------- */
/**** PRECONFIG, OVERRIDES, VARIABLES, TYPOGRAPHY ****/
/* -------------------------------------------------------------- */
// VARIABLES.LESS Override
//---------------------------------------------------------------
// Colors
@whiteSmoke:            #f5f5f5;

// Typo
@sansFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
@serifFontFamily:       Georgia, "Times New Roman", Times, serif;
@monoFontFamily:        Monaco, Menlo, Consolas, "Courier New", monospace;
40
aspirinemaga