Kuinka asentaa SASS:

SASS tai Syntactically Awesome Stylesheets on CSS: n laajennus ja auttaa meitä kirjoittamaan joustavampia tyylejä. Tämä lisää CSS: n peruskielelle enemmän valtaa. SASS on esikäsittelykieli, joka on käännetty CSS: ään ja jolla on erilaiset tekniset syntaksit. SASS-koodin kirjoittaminen ei anna selaimille tulkita koodia, mikä ei ole oikea CSS, vaan tarvitsemme kääntäjän täydentääksesi CSS: ään kirjoittamaamme koodia selainten tulkitsemaan ja ymmärtämään sitä. Muuttujia, yhdistelmiä, sisäkkäisiä sääntöjä, sisäistä tuontia jne. Voidaan käyttää SASS-ohjelmassa yhteensopivan CSS-syntaksin kanssa. Kompassi-tyylikirjaston avulla Syntactically Awesome Stylesheets pitää suuret tyylitaulukot hyvin järjestetyinä ja saada pienet tyylitaulukot valmiiksi ja ajamaan hyvin lyhyessä ajassa. Yhdessä ominaisuuksien kanssa, kuten täysin CSS-yhteensopiva alusta ja kielilaajennukset, kuten pesäys, mixins, WTC, se tarjoaa myös ominaisuuksia, kuten monia tärkeitä toimintoja värien ja erilaisten muiden arvojen käsittelemiseen. Siinä on myös muita edistyneitä ominaisuuksia, kuten kirjastojen ohjausdirektiivit, oikein muotoiltu, muokattava ulostulo ja monet muut.

Ohessa on järjestelmävaatimus syntaksisesti mahtavien tyylitaulukkojen asennukseen:

  • Käyttöjärjestelmä - Se voi olla mikä tahansa käyttöympäristöjen välinen käyttöjärjestelmä.
  • Ohjelmointikieli - Ohjelmointikieli on Ruby.
  • Selain - Se voi olla mikä tahansa selain, kuten google chrome, Internet Explorer, safari, Mozilla Firefox, ooppera jne.

SASS: n asentamisen vaiheet:

Alla on vaiheet asentaaksesi syntaktisesti mahtavat tyylitaulukot -paketti järjestelmään:

Vaihe 1:

Lataa Rubyn nykyinen vakaa versio käyttämällä alla olevaa linkkiä. Se lataa zip-tiedoston, joka on purettava pakkausta varten asennusta varten. Winzip tai 7zip voidaan käyttää tiedoston purkamiseen.

https://www.ruby-lang.org/en/downloads/

Vaihe 2:

Asenna Ruby järjestelmään pakkauksen purkamisen jälkeen järjestelmään noudattaen tavallista asennusmenettelyä.

Vaihe 3:

Lisää Ruby bin -kansio PATH-käyttäjämuuttujaan ja järjestelmämuuttujaan, jotta se voi toimia helmikomentojen kanssa.
PATH-muuttujien lisääminen:

  1. Napsauta ensin hiiren kakkospainikkeella työpöydän tietokonekuvaketta.
  2. Siirry ominaisuuksiin avattavasta valikosta.
  3. Napsauta sen jälkeen Lisäasetukset-välilehteä ja napsauta sen jälkeen ympäristömuuttujia.
  • Kun ympäristömuuttujat-ikkuna avautuu, kaksoisnapsauta PATH-kohtaa muuttujien sarakkeen yläosassa. Alla on kuvakaappaus, joka näyttää sen:

  • Kaksoisnapsauttamalla PATH-painiketta, muokkaa käyttäjän muuttuja -ikkuna avautuu. Lisää rubiinialustan polku muuttujan arvokenttään C: \ Ruby \ bin. Jos muille tiedostoille on asetettu muita polkuja, laita puolipiste ja lisää rubiinipolku. Alla on kuvakaappaus, joka näyttää sen:

  • Napsauta Ok-painiketta suorittaaksesi tehtävän loppuun.

Järjestelmämuuttujan asettaminen:

  • Järjestelmässä muuttuva välilehti napsauttaa uutta painiketta.
  • Sen jälkeen uusi järjestelmämuuttuja-ikkuna avautuu. Täytä muuttujan nimen kenttään RubyOpt ja muuttujan arvon kenttään RubyGems. Napsauta seuraavaksi OK-painiketta suorittaaksesi tehtävän loppuun. Alla on kuvakaappaus, joka näyttää sen:

Vaihe 4:

Suorita järjestelmän komentokehotteessa komento gem install Scss. Tämä asentaa kotelot järjestelmään.

Vaihe 5:

SASS, kun asennat onnistuneesti, antaa alla olevan näytön. Tarkista se saadaksesi vahvistuksen.

Alla on esimerkki SASS: n perustoteutuksesta.


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day

Luomme hienon esimerkit.css, joka on samanlainen kuin CSS, odottaa tosiasian, että se tallennetaan .scss-laajennuksella. Tämä on luotava rubiinikansion sisään .htm-tiedostojen kanssa. Valinnaisesti scss-tiedosto voidaan tallentaa myös kansion polulla ruby ​​\ lib \ scss. Luo kansio sass lib-kansioon ennen scss-tiedoston luomista.

h1( color: #AF80ED; ) h3( color: #DE5E85; )

SASS voidaan ohjata katsomaan tiedostoa ja päivittämään CSS aina, kun SCSS-tiedostossa tapahtuu muutoksia. Alla on komento:

sass --watch C:\ruby\lib\sass\ example.scss: example.css

Kun yllä oleva komento suoritetaan, se luo automaattisesti example.css-tiedoston. Kun muutat scss-tiedostoa, esimerkki.css-tiedosto päivitetään automaattisesti.

Kun yllä oleva komento suoritetaan, esimerkki.css-tiedosto luodaan seuraavalla sisällöllä.

h1( color: #AF80ED; ) h3( color: #DE5E85; )

Muut kuin yllä olevat alla olevat vaiheet ovat muut tapaa asentaa SASS:

On olemassa monia sovelluksia, jotka tarjoavat helppoja ja käyttäjäystävällisiä tapoja asentaa SASS. Ne voidaan ladata Internetistä. Näistä muutama näistä tulee ilmaiseksi, kun taas toiset maksetaan.

NPM: ää voidaan käyttää myös SASS: n asentamiseen, jos käyttäjä käyttää node.js.

Siksi yllä olevassa vaihe vaiheessa opas SASS voidaan asentaa onnistuneesti järjestelmään. Alla on komento:

npm install -g sass

Mutta huomaa, että tämä asennus asentaa Syntaktisesti mahtavien tyylitaulukoiden puhtaan javascript-toteutuksen, joka on suhteellisen hitaampi kuin muut tässä esitetyt menetelmät, mutta silti sillä on sama käyttöliittymä kuin muilla menetelmillä. Siksi hitauden ollessa kyseessä on kysymys, onko erittäin helppo siirtyä toiseen toteutukseen myöhemmässä vaiheessa nopeuden lisäämiseksi.

Jos joku käyttäjä käyttää Chocolatey paketinhallintaa Windowsille, dart SASS voidaan asentaa. Alla on komento:

choco install sass

Jos joku käyttäjä käyttää Homebrew-paketinhallintaa Mac OS X: lle, dart SASS voidaan asentaa. Alla on komento:

brew install sass/sass/sass

SASS tarjoaa niin monien ominaisuuksien lisäksi myös SASS- tai Syntaktisesti mahtavat tyylitaulukot laajan valikoiman ominaisuuksia, joita käytetään verkkosivujen suunnittelussa entistä helpommin. SASS tarjoaa erilaisia ​​CSS-laajennuksia, kuten sisäkkäisiä ominaisuuksia, paikkamerkkivalinnat jne. Se tukee myös SASS-skriptejä, jotka tarjoavat interaktiivisen kuoren ohjelmointiin, sekä tukea eri muuttujille, tietotyypeille, toiminnalle, toiminnolle, interpoloinnille jne. Asennusprosessi on myös niin helppo suorittaa. Kaikkien ominaisuuksien lisääminen SASS tarjoaa poikkeuksellisen hienon alustan työskennellä web-suunnittelussa ja muissa.

Suositellut artikkelit

Tämä on opas asentaa SASS. Tässä keskustelimme vaiheesta SASS-asennuksen prosessista. Voit myös käydä läpi muiden ehdotettujen artikkeleidemme saadaksesi lisätietoja -

  1. Täydellinen opas .NET: n asentamisesta
  2. Kuinka asentaa PostgreSQL?
  3. Eri vaiheet kirjoitusohjelman asentamiseen
  4. Kuinka asentaa Appium

Luokka:

Ohjelmistokehitys