less - PHPStorm 中的较少 Filewatcher 编译器

Question

尝试使用PHPStorm File watcher.less编译文件时我做错了什么？.css

这是屏幕截图，（请打开此链接查看图像的全尺寸）：

我安装了npm install -g less，安装后NodeJS。lessc使用以下命令在 Windows 操作系统中使用cmd.exe命令行工具时，编译器可以正常工作：

lessc custom.less custom.css，但它不会在 Filewatcher 的 PHPStorm 中执行任何操作。

任何线索我应该纠正什么，请？

Answer 1

对于那些想在他们的 IDE PHPStorm 中配置 LESS 自动编译器的人，你可以这样做：

1. 下载并安装Node.js
2. 打开终端/Shell/命令行，cmd.exe适用于 Windows 环境
3. 在命令行终端中，键入npm install -g less并等待 LESS 下载并安装。
4. 在 PHPStorm 打开设置窗口：文件 > 设置 (CTRL+ALT+S)
5. 导航到File Watchers（或在 SETTINGS 窗口中搜索）
6. 单击“设置”对话框右侧的+
   
   以创建一个新的文件观察器并按照图片所示对其进行配置： 这就是上一张图片中设置的文件夹结构应如下所示：
   
7. 保存并测试它，每次您在.less文件中键入内容时，它都会自动编译成.css您之前在 File Watcher 的设置对话框中定义的内容。
   要取消对源文件较少的文件，请创建一个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;