如何將Sass編譯成CSS

2022-06-28 21:03:18 字數 1327 閱讀 1146

命令編譯

命令編譯就是在終端中輸入sass命令來編譯 sass **,這種編譯方式使用起來很簡單。

示例:假設現在有乙個sass檔案,檔名為style.scss(sass 檔案的副檔名名.scss),我們需要將這個檔案中的**編譯成 css **,可以執行如下命令:

sass style.scss style.css
命令執行成功後,會自動建立乙個style.css檔案。但是這樣有乙個問題,就是每次更改了style.scss檔案中的內容,都需要執行一次編譯命令,就會很麻煩。

如果要解決上述問題,可以使用監聽命令--watch,例如:

sass --watch style.scss:style.css
如果專案中有很多的 sass 檔案,可以監聽整個目錄:

sass四種輸出格式

在編譯 sass **時,我們可以指定 sass 的編譯輸出格式,這需要用到--style指令,這個指定後面可接如下四種 sass 輸出格式:

示例:例如以style.scss檔案為例,內容如下所示:

.xkd

}

sass style.scss:style.css --style nested
編譯後的 css **:

.xkd 

.xkd .box

sass style.scss:style.css --style expanded
編譯後的 css **:

.xkd 

.xkd .box

sass style.scss:style.css --style compact
編譯後的 css **:

.xkd 

.xkd .box

sass style.scss:style.css --style compressed
編譯後的 css **:

.xkd.xkd .box
這四種輸出格式中,一般我會選擇使用第二種輸出格式,也就是expanded格式。這種格式和我們手寫的 css 樣式差不多,選擇器、屬性等各占用一行,屬性根據選擇器縮排,而選擇器不做任何縮排。

sass自動編譯成css檔案

有乙個資料夾.static styles下面有很多的scss檔案和css檔案,如何做到,在編寫 scss 問價的時候,實時的編譯 css 檔案?解決方案 監控 scss 檔案 在終端,進入到.static這個資料夾下面,使用 sass watch styles styles就可以進行實時的編譯和轉換...

如何將dtb反編譯成dts

我使用的ubuntu 版本是10.4 home clh imx6 deliver kernel source scripts dtc dtc i dtb o dts home clh imx6 deliver kernel source arch arm boot dts zimage imx6dl...

Linux下如何將原始檔逐步編譯成目標檔案的過程

請講一下linux如何原始檔逐步編譯成可執行檔案。首先先上圖對編譯的整個過程有個感性的認識,然後再逐步分析各個過程。以hello.c 程式為例 乙個.c源程式需要經過預處理器生成.i檔案,再經過編譯器生成.s檔案,再經過彙編器生成可重定位目標檔案.o檔案,再與其他.o檔案經過鏈結器生成最終的可執行目...