Come installare e iniziare con Sass?

Stylesheet (SASS) sintatticamente fantastico, un'estensione di CSS che pre-elabora CSS e funziona bene con tutte le sue versioni e migliora la capacità della lingua di base. Risparmia molto tempo e sforzo impedendo ai suoi utenti di utilizzare i valori CSS ridondanti. Inoltre, puoi scaricare e utilizzare Sass gratuitamente. In questo articolo, ti diremo come installare e iniziare con Sass.

Come installare e iniziare con Sass

La procedura di installazione di SASS può essere eseguita in vari modi come l'utilizzo di alcune applicazioni open source, l'installazione di SASS utilizzando la riga di comando, installandola sugli editor di codice desiderati come Codice VS, Sublime, Atom, ecc. Dal repository GitHub.

Discutiamo in dettaglio queste procedure di installazione.

Installa SASS utilizzando applicazioni

Sono disponibili numerose applicazioni (a pagamento e gratuite) che ti aiuteranno a installare ed eseguire SASS in pochissimo tempo per Windows, Mac OS e Linux. Alcune applicazioni sono elencate di seguito.

1. Prepos (a pagamento) per Windows, Mac e Linux.
2. CodeKit (pagato) per Mac.
3. Hammer (pagato) per Mac.
4. Koala (gratuito) per Mac, Linux e Windows.
5. Scout-app (gratuito) per Linux, Mac e Windows.

Nota: Non è necessario utilizzare le applicazioni a pagamento per le fasi di sviluppo iniziale perché quelle libere sono completamente funzionali.

Installa Sass usando la riga di comando

Di seguito abbiamo discusso di come installare SASS utilizzando la riga di comando su varie piattaforme.

Installazione ovunque (standalone)

È possibile installare con grande facilità SAS su qualsiasi piattaforma come Mac OS, Linux, Windows scaricando il suo pacchetto che è rilevante per la piattaforma che usi, dal repository GitHub. Una volta scaricato includi il pacchetto nel tuo percorso. Tale installazione non richiede alcuna dipendenza, quindi è l'approccio più semplice.

Installazione tramite NPM

Se sei un nodo.Utente JS Quindi è possibile utilizzare il seguente comando NPM e installare il pacchetto di SASS.

NPM Installa -G Sass

Il comando sopra installa un'implementazione JS pura di SASS che è un po 'più lenta rispetto ad altre opzioni di installazione disponibili. Tuttavia, se desideri migliorare la sua velocità, puoi cambiare l'implementazione in qualsiasi altra poiché l'implementazione JS ha la stessa interfaccia come altre implementazioni.

Installazione tramite Chocolatey

Se si dispone di un sistema operativo Windows e hai anche installato un gestore di pacchetti cioccolatini, si utilizza il comando seguente per installare Dart Sass.

Choco Installa Sass

Installazione tramite Homebrew

Gli utenti Mac OS X e Linux possono installare il pacchetto SASS utilizzando il gestore pacchetti Homebrew tramite il comando seguente.

Brew Installa SASS/SASS/SASS

Installa SASS sugli editori di codice

Come già accennato, puoi utilizzare SASS su vari editor di codice come VS Codice, Sublime, Atom ecc. Questa potrebbe essere un'opzione preferita per molti poiché la maggior parte di noi ha già familiarità con molti redattori di codice popolari. Ad esempio, per motivi di comprensione, qui dimostreremo come puoi usare SASS su vs code.

Passo 1

Visita il compilatore Sass Live e premi Installa per scaricare l'estensione.

Passo 2

Non appena si preme il pulsante Installa, l'estensione si aprirà nel tuo editor di codice VS.

Ora premi il pulsante di installazione evidenziato e l'estensione verrà installata nell'editor di codice.

Estensione installata correttamente!

Nota: Quando è installata l'estensione, è possibile utilizzare Ctrl + shift + x Per aprire l'estensione ogni volta che desideri.

Passaggio 3

Ora puoi aprire il .File SCSS e inizia a scrivere il tuo foglio di stile. Una volta che lo farai noterai un'opzione che dice "Guarda Sass" nell'editore.

Fai clic su questa opzione per generare il file della mappa CSS e il file CSS automaticamente. Più tardi, puoi collegare questo file CSS al tuo documento HTML.

Segui i passaggi sopra menzionati per installare facilmente SASS sull'editor di codice VS.

Conclusione

È possibile installare e iniziare con SASS utilizzando vari modi come utilizzare alcune applicazioni open source, installarla utilizzando la riga di comando, installarla sugli editor di codice desiderati come VS Codice, Sublime, Atom, ecc. Il repository GitHub. Puoi selezionare una qualsiasi delle opzioni in base alla tua facilità e desiderio. Tutte queste opzioni sono state spiegate in modo approfondito in questo post.