此篇文章建立已經有 npm 的情況下。

如果是像我還有需要 node.js 的人，只要去安裝了 node.js，也會同時安裝 npm，至於如何安裝 node.js 可以去它的官網看=>https://nodejs.org/en/ 。

回到這次主題。

環境分成兩種

  • 全域的方式
  • 本地端的方式

全域的方式代表只要裝了一次，整台電腦都會有 sass，而本地端則是範圍只限於一個專案之中，個人偏好使用本地端的方式，儘管可能每次都要裝一次，但會比較清楚使用了什麼。

全域安裝 sass 環境

第一步打開終端機。

第二步直接打指令。

安裝的指令： npm install -g sass
解除安裝的指令： npm uninstall -g sass

在這過程中可能會直接錯誤，畫面上會給出報醋，這是十分正常的，爬文後發現有一些權限問題，這時候只要最前面加上sudo，以及之後打上密碼就 ok 了。

例如：
安裝的指令 => sudo npm install -g sass
解除安裝的指令 => sudo npm uninstall -g sass

而要怎麼檢查安裝有沒有成功，或是有沒有成功卸載，可以透過查詢 sass 的版本來檢查，一樣在終端機的地方打上這段指令:sass --version。

要是你跟我一樣沒有在全域安裝的話就會出現這一段：

本地端安裝 sass 環境(自動編譯版)

在創立一個專案後，進入到裡面開始以下步驟。

  1. 先 npm init -y
    他跟 npm init 幾乎一樣，只是它會幫你把預設選項全部跳過，產生一個空白的 package.json (懶人專用)

  2. 使用 nam install sass

  3. 加上 "sass": "sass --watch scss/style.scss:style/style.css"

  4. 把 scss 的資料夾給創出來

  5. 成功編譯！
    之後之要寫npm run sass就可以一直幫忙自動編譯。