Frontend Intermediate Course - 作業十

作業十的 GitHub 連結：改掉你的壞習慣：ESLint 與 standard

這次作業應該是最快完成的一個作業～

我選擇 semistandard 做為我這次作業的規範，是 standard 的分號版本，兩個版本大同小異，最大差別在於 semistandard 在程式碼裡面要加分號，而 standard 不用加分號。因為我原本的程式碼都有加分號的習慣，所以就選 semistandard。

semistandard 需要 Node.js 支援並用 npm 安裝，這個部份經過前兩個作業的訓練已經很熟悉了。後來發現 Sublime 上有套件可以用，也有順便安裝。

在 Sublime Text 3 將 Sass 編譯成 CSS

在 動畫互動網頁程式入門（HTML/CSS/JS）上，吳哲宇老師使用 Sass 當作 CSS 的預處理器，可以設定變數、利於 Nesting、引入 Mixins 等等優點，比起純 CSS 還要方便好用。剛好 Frontend Intermediate Course 中的第三週作業就是要用預處理器寫 CSS，於是想要在 Sublime 上面設定 Sass，並將 Sass 編譯成 CSS。

在 Sublime 上面把 Sass 編譯成 CSS 比我想像還要麻煩，本來以為只要在 Sublime 上面安裝 Sass 套件就可以了，結果根本不是這樣子（我太天真的啊...）

Google 搜尋之後發現還需要安裝 SASS Build 套件才可以將 Sass 編譯成 CSS。當我以為這樣就完成安裝設定後才發現，不是只在 Sublime 上面安裝那兩個套件，還要在電腦安裝 Ruby 跟 Sass 才可以，我果然是太天真了...

於是就努力的研究一下到底要怎麼安裝設定才可以，以下是我自己的設定過程，如果需要比較詳細的教學，我在 YouTube 上面發現 Peter Sommerhoff 教學影片還不錯 Sass Beginner Tutorial，可惜是在我差不多都設定完成之後才看到。

Sublime Text 3 套件安裝紀錄

這篇只是單純想記錄自己的 Sublime Text 3 安裝了哪些好用的套件，萬一哪一天需要重新安裝 Sublime 的時候可以回頭看，未來應該會持續發現好用的套件，也可以更新及寫下各個套件使用的小技巧，總之算是自己的 Sublime 小抄。

在網路上參考了許多前輩的教學文章，受益良多。其實我仍在摸索中，安裝的套件目前以前端網頁設計為主。

首先當然一定要安裝 Sublime Text 3，然後再安裝 Package Control，未來要安裝任何套件都要透過它。安裝步驟可以參考 The Will Will Web 保哥寫的文章，圖文並茂很詳細，我也有安裝不少個保哥推薦的套件。