Ce face compilarea?
Compilarea fișierelor Sass transformă foile de stil cu sintaxa specifică Sass, cum ar fi cuibări de selectori și mix-uri, în CSS normal care poate fi analizat de browsere.
Cum îl instruiesc să compileze fișierele .scss din dosarul de mai sus în dosarul
public/build/css/?
Din moment ce folosiți deja Bower care este un pachet Node.js, presupun că nu aveți nicio problemă în a folosi pachetul Node.js node-sass în loc de versiunea originală Ruby.
În primul rând, instalați pachetul folosind npm i -D node-sass. Apoi, creați un nou script în interiorul package.json al proiectului dvs.:
main.scss este acum punctul dvs. de intrare în care importați Bootstrap și celelalte foi de stil.
// I don't know whether this path is correct// Just find out the location of "_bootstrap.scss" and then create the relative path@import "../../../bower_components/bootstrap-sass/assets/stylesheets/_bootstrap.scss";/* Your custom SCSS */În cele din urmă, pentru a rula efectiv compilarea, executați npm run compile-sass în terminalul dvs.
Trebuie să configurez noi fișiere .scss sau pot seta astfel încât să le adaug pur și simplu la acel folder sass?
Din moment ce nu îi spuneți niciodată lui node-sass să „compileze totul în interiorul acestui folder” și în schimb folosiți un fișier punct de intrare (main.js), atunci când doriți să includeți un fișier nou, pur și simplu adăugați o directivă @import cu o cale relativă către acesta.
Bonus, cum îi spun să minifice sau nu fișierul de ieșire (astfel încât să pot experimenta ambele moduri)?
Pentru a minifica fișierul main.css rezultat, recomand csso. Puteți instala pachetul său CLI folosind npm i -D csso-cli și apoi adăugați un alt script la package.json:
"minify-css": "csso public/build/css/main.css public/build/css/main.min.css"Puteți apoi rula acel script folosind npm run minify-css. Fișierul minificat va fi emis ca main.min.css.
.