Faka i-Stylus ku-ArchLinux ngaphandle kokufa emzameni

Stylus ikhodi yangaphambi kweprosesa CSS, esivumela ukuthi sisebenze kalula kumhleli wethu wombhalo bese ngichaza izizathu zesitatimende sami.

Stylus

Angizenzi ngathi ngifundisa ukuthi isebenza kanjani Styluskepha khombisa ezinye izibonelo nendlela yokufaka

Leli yiphepha lesitayela njengoba silazi:

umzimba {font: 12px Helvetica, Arial, sans-serif; } a.button {-webkit-border-radius: 5px; -moz-border-radius: 5px; i-border-radius: 5px; }

Futhi lokhu kuzoba ishidi lesitayela elifanayo elidalwe I-Stylus:

ifonti yomzimba 12px Helvetica, Arial, sans-serif a.button -webkit-border-radius 5px -moz-border-radius 5px border-radius 5px

Zikuphi izikhiye? Ayaphi ama-semicolon, ikholoni? Ukhohliwe, Stylus usenzela lokho.

Uma uqala nge CSS y i-HTML akunconywa ukuthi usebenzise Stylus ngeqiniso elilula lokuthi ungakhohlwa ukuthi izinto zisebenza kanjani ngempela, kepha uma usunesikhathi vele kulo mhlaba futhi ufuna ukuzisindisa ikhodi bese usebenza .. qhubeka.

Abahleli Python izothola ku Stylus okuthile okufana ncamashi nalokho okujwayele ukwenziwa, ngoba udinga kuphela ukuhlehlisa kahle ukuze umlingo wenziwe.

Ukufakwa

Ngakho lokho Stylus umsebenzi kufanele siwufake I-Node.js okugatsha loMphakathi, ngakho-ke siyaqhubeka nokukwenza:

$ sudo pacman -S nodejs

Futhi kamuva sifaka i-Stylus. Indlela yendabuko kungaba:

$ npm install -g stylus

Ifaka kahle, kepha ayisebenzi kimi, ngakho-ke kulula kakhulu ukuyifaka kusuka ku-AUR:

$ yaourt -S nodejs-stylus

Ungayisebenzisa kanjani i-Stylus

Kulungile, sesivele siyifakile I-Node.js futhi sikufakile Stylus.. Sisebenzisa kanjani? Kuyinto elula. Masithi sinesikhombi esinamafayela alandelayo:

- dir - inkomba.html - isitayela.css

Okufanele sikwenze ukudala ifayili isitayela.styl, okuyiyona esizosebenzela kuyo. Kulelo fayela singaba nokuthile okufana nalokhu:

umbala ongemuva lomzimba #ffff usayizi wefonti u-12px a. inkinobho yombala obomvu we-padding 10px

Uma sigcina noma senza ushintsho akwenzeki lutho, ngoba "asihlanganisi" ifayili lethu. Ukuyihlanganisa, esikwenzayo ukuvula ukuphela kwirejista yethu (lapho ifayela isitayela.styl) futhi senza:

stylus -c style.styl

Kepha ngaso sonke isikhathi lapho sigcina khona ifayili isitayela.styl kuzofanele sisebenzise ikhodi, kepha ngenhlanhla akudingekile, ngoba uma senza umyalo ofanayo, kepha sengeza ipharamitha -w (buka) okulandelayo kuyenzeka:

isitayela -c -w isitayela.styl ukubukela / usr/lib/node_modules/stylus/lib/functions/index.styl ihlanganiswe isitayela.css ukubukela isitayela.styl ihlanganiswe isitayela.css isitayela esihlanganisiwe.css

Ngamanye amagama, ifayili lihlanganiswa ngokuzenzakalela .. Kungaba umphumela?

umzimba {umbala-ongemuva: #fff; usayizi wefonti: 12px} a.button {color: # f00; padding: 10px}

Njengoba ukwazi ukubona, ikhodi yethu ayisidali kuphela CSS, kodwa iqeda izikhala ezingadingekile ukuze ishidi lethu lesitayela libe nesisindo esincane 

Hhayi lokho kuphela, Stylus Kusivumela ukuthi sidlulise amafayela we-CSS ngefomethi yawo futhi indlela esingasebenzisa ngayo i-syntax yabo yehluke kakhulu. Futhi lokhu kungukubuka kuqala. Ngakho-ke ngiyakukhuthaza uma unentshisekelo, ukwazi okwengeziwe ngalo Stylus


Engeza njengomthombo okhethwayo ku-Google