2013-07-31 16 views
19

C'è un modo per configurare SASS FileWatcher in modo da creare un CSS minisito?Come ridurre CSS con SCSS File Watcher in PHPStorm IDE

Attualmente ho configurato SASS + YUI Compressor per eseguire ciò, ma mi piacerebbe farlo con SASS puro se possibile.

Ecco le schermate di entrambe le configurazioni:

SASS

YUI Compressor CSS

Grazie in anticipo.

+5

Hai controllato gli argomenti della riga di comando? Il compilatore SASS (scss.bat) supporta l'opzione '--style compressed', che produce ** output molto compatto/compresso ** - http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html# stile_output. Se lo desideri, puoi elaborarlo di nuovo con YUICpressore (per * eventualmente * ottenere poche ottimizzazioni). ** In alternativa ** crea un file .BAT/.CMD che dovrebbe prima compilare il codice sass e poi eseguirlo tramite YUIC (2 righe in totale) e usarlo nel tuo File Watcher invece del compilatore SASS attuale. – LazyOne

+0

@LazyOne Questa dovrebbe essere una risposta. :) – KatieK

risposta

43

Probabilmente il modo più veloce per ottenere ciò è utilizzare l'opzione compressa, menzionata nei commenti precedenti, come argomento. Il modo più rapido per configurare questo in PhpStorm è la seguente:

  • Vai File > Settings
  • All'interno Project Settings selezionare File Watchers
  • Si dovrebbe già avere un osservatore SCSS creato qui (se avete il plugin orologio SCSS abilitato, PHPStorm ti chiede di creare un watcher quando apri un nuovo file .scss.) Altrimenti, abilitalo (maggiori informazioni a riguardo in questa sezione di official documentation,) e poi crea il nuovo watcher premendo il simbolo "+".
  • Fare doppio clic sul nome dell'utente per accedere alla relativa configurazione.
  • Nella linea Arguments assicurarsi di aggiungere l'argomento --style compressed
  • Fare clic su OK e il gioco è fatto

Questa immagine mostra come tale configurazione dovrebbe apparire:

Compressed SCSS settings in PHPStorm

Da quel punta su, i tuoi file di output .css verranno compressi.

+7

ecco gli argomenti completi: --no-cache - stile compresso - update $ FileName $: $ FileNameWithoutExtension $ .min.css – achucuan

Problemi correlati