SASS SCSS 編譯工具安裝教學，使用 Dart-Sass

Posted on 2018-04-27 Edited on 2023-11-24 In SASS Views: Disqus:

先前在 windows 10 作業系統下想安裝 sass/scss 編譯器時，

SASS 官網的安裝教學是先安裝 ruby 編譯環境後，再下 ruby 指令安裝 sass/scss 編譯器，

但現在 Ruby-Sass 的編譯方式已不被 SASS 官網所推薦了，他將會 deprecated。

現在 Dart-Sass 的編譯方式，是 SASS 官網推薦；

我選擇使用「Install Anywhere (Standalone)」安裝方法，教學如下。

其實這應該叫做「設定環境變數」

一、取得 sass/scss 編譯程式

由於我的作業系統是 windows 10 X64，所以選擇 dart-sass-1.3.0-windows-x64.zip

二、設定環境變數

假設我決定把 sass/scss 編譯程式放在路徑 C:\dart-sass

那我環境變數設定步驟如下

於系統變數下對「Path」變數做編輯

添加路徑 C:\dart-sass 後，按確定

回到「環境變數」視窗後，記得再按確定

三、安裝成功

設定完成後，再開啟 terminal，測試是否設定完成，

來看一下 sass/scss 編譯器的版本，打入下面指令，

sass --version

成功畫面如下

四、後記

watch 指令有 bug 很久了，現在也還不能使用，我個人推薦還是使用 Ruby Sass 好了。

或是籍由 npm 來安裝 sass，$npm install sass。

參考資料：