Sass + compass – dotazy začátečníka

19. 2. 2015 23:13:28

Zdravím, chtěl bych se naučit používat sass + compass. V souvislosti s touto problematikou mám pár dotazů:

1) je možné při psaní souborů scss (před kompilací na css) sledovat jak se bude daná úprava projevovat na samotném vzhledu webové stránky nebo je potřeba po každé změně skript zkompilovat?

2) jak mohu sloučit více scss souborů do jednoho výsledného css a vytvořit tak css loader?

3) vyplatí se sass + compass používat i u menších webových stránek nebo je to spíše určené pro rozsáhlé webové projekty?

Dále bych byl velmi rád za nějaké "best practices" při používání víše uvedených nástrojů, případně i odkazy na internetové zdroje.

Děkuji

19. 2. 2015 23:13:28

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092596

Petr Soukup

(5 hodnocení)

19. 2. 2015 23:55:46

1) je možné nastavit automatickou kompilaci při změně - to myslíte?

2) obvykle se to dělá tak, že existuje jeden hlavní soubor (třeba base.scss), který importuje ostatní. Kompilace pak probíhá nad tímto souborem, takže je výsledkem jeden soubor. Je to praktické, protože pak jde snadno podmínkovat, že se má kompilovat třeba jen css pro mobil a podobně

3) podíval bych se na to spíš obráceně - je nějaký důvod nepoužívat to na menší weby?

19. 2. 2015 23:55:46

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092595

Taps

(118 hodnocení)

20. 2. 2015 05:10:06

diky za reakci

1)teoreticky ano, v praxi se mi jedna abych si mohl zkontrolovat jak se dana uprava scss projevi v css

2)muzes mi uvest nejakou ukazku

jeste me napadlo existuje i nejaka moznost debugovani?. dekuji

20. 2. 2015 05:10:06

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092594

Petr Vojáček

(6 hodnocení)

20. 2. 2015 11:09:26

Za zmínku stojí i livereload.com. Dá se k němu připojit složka s compassem a kompiluje automaticky scss a automaticky také refreshne browser po každé změně. Bohužel pro Windows jen v alpha verzi.

Každopádně v compassu používám task compass watch, který automaticky sleduje změny v scss souborech a zkompiluje je na zadané místo.

20. 2. 2015 11:09:26

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092593

Ondrej Machala

(27 hodnocení)

20. 2. 2015 19:00:36

K tem best-practices: pokud chces pouzivat moderni nastroje od stylu (sass, compass, susy, less, ...) pres grunt az treba po javascript (node, angular, ..) tak velmi doporucuji prejit na nejaky operacni system (Linux .. OS X) ktery tyhle veci podporuje (=ma pouzitelnou konzoli).

vsechny tve dotazy pak vyresi jeden prikaz: 'compass watch'

20. 2. 2015 19:00:36

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092592

Petr Soukup

(5 hodnocení)

20. 2. 2015 19:28:34

Napsal Ondřej Machala;1170201
K tem best-practices: pokud chces pouzivat moderni nastroje od stylu (sass, compass, susy, less, ...) pres grunt az treba po javascript (node, angular, ..) tak velmi doporucuji prejit na nejaky operacni system (Linux .. OS X) ktery tyhle veci podporuje (=ma pouzitelnou konzoli).
vsechny tve dotazy pak vyresi jeden prikaz: 'compass watch'

Úplně to samé funguje bez problémů na Windows.

Spíš bych doporučil pořádné IDE. Například PHPStorm má grunt apod hezky integrovaný, takže při rutinní práci není potřeba šaškovat s konzolí (ale samozřejmě ji použít lze).

20. 2. 2015 19:28:34

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092591

vpixle

(3 hodnocení)

24. 2. 2015 14:03:52

A neexistuje Sass preprocesor? Ja si pamatuju, ze existovalo neco jako less.js, ktery sis pridal do appky a po cely develop jsi hroutil v Less-u no a pred releasem se to vsechno prelozilo, zminimalizovalo a slo to do sveta. Ale zalezi jak mas nastavenej workflow. Pokud pouzivas nejakej GRUNT/GULP tak by ses o to uz nemusel starat.

24. 2. 2015 14:03:52

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092590

Petr Soukup

(5 hodnocení)

24. 2. 2015 14:13:42

Ano, to dělá argument watch.

Less.js je něco jiného - na webu se načítají přímo less soubory a javascript to převádí.

Alternativně jde ve Chrome si zapnout přímo podporu SASS. Je to ale experimentální - http://code.tutsplus.com/tutorials/developing-with-sass-and-chrome-devtools--net-32805

24. 2. 2015 14:13:42

https://webtrh.cz/diskuse/sass-compass-dotazy-zacatecnika#reply1092589

Pro odpověď se přihlašte.

Přihlásit