Meno Penguin Computing compilatore in PhpStorm

Question

cosa I'am facendo male quando si cerca di compilare i file .less in .css con PhpStorm File Watcher?

Ecco lo screenshot, (pls aprire THIS LINK per vedere la dimensione completa dell'immagine):

ho installato npm install -g less, dopo essersi installato NodeJS. Funziona bene il compilatore lessc quando si utilizza cmd.exe - Command Line Tool in Windows OS con questo comando:

lessc custom.less custom.css, ma non farà nulla all'interno PhpStorm a Penguin Computing.

Qualsiasi indizio su cosa dovrei correggere, per favore?

Answer 1

Per chi desidera configurare MENO compilatore automatico all'interno del loro PhpStorm IDE, si può fare in questo modo:

1. Scaricare e installare Node.js linea
2. Apri terminale/Shell/Comando, cmd.exe per Windows Ambiente
3. All'interno del terminale Riga di comando, digitare npm install -g less e attendere che venga scaricato e installato LESS.
4. Nella PhpStorm finestra Impostazioni aperte: File> Impostazioni (CTRL + ALT + S)
5. Naviga a osservatori del file (o ricercarlo IMPOSTAZIONI all'interno della finestra)
6. Cliccare sulla + sulla destra lato della finestra di dialogo per creare un nuovo File Watcher e configurarlo impostazioni come mostrato nella foto:
   
   ed è così che la struttura delle cartelle dovrebbe essere simile per le impostazioni della precedente immagine:
   
7. Salvalo e testalo, ogni volta che digiti qualcosa nel file .less, esso verrà automaticamente compilato in .css che hai già definito nella finestra di dialogo delle impostazioni di File Watcher.
   Per non danneggiare i file di origine, creare uno template.less come mostrato nell'immagine e caricare i file di origine lì prima di eseguire qualsiasi operazione di stilo.

/*! 
* 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;