『壹』 如何安裝Sass
ruby安裝
因為sass依賴於ruby環境，所以裝sass之前先確認裝了ruby。先導官網下載個ruby
在安裝的時候，請勾選Add Ruby executables to your
PATH這個選項，添加環境變數，不然以後使用編譯軟體的時候會提示找不到ruby環境
sass安裝
如果你喜歡偷懶，或者你公司網路限制比較多，請直接看最後一段
安裝完ruby之後，在開始菜單中，找到剛才我們安裝的ruby，打開Start Command Prompt with Ruby
然後直接在命令行中輸入
gem install sass
按回車鍵確認，等待一段時間就會提示你sass安裝成功。
如果要安裝beta版本的，可以在命令行中輸入
gem install sass --pre
你還可以從sass的Git repository來安裝，git的命令行為
git clone git://github.com/nex3/sass.git cd sass rake install
如果上述的辦法你嘗試失敗了，那說明要麼被你的網路牆了這個，要麼你的網路信號不好。你可以嘗試本地安裝，不過有點復雜。這里暴漏個驚天秘密，那就是koala這個編譯工具已經內置了sass，所以如果你安裝了koala，就根本不需要安裝sass，注意ruby還是得安裝。關於koala請參閱編譯工具。
『貳』 如何安裝並編譯sass為css文件
1、koala軟體編譯
2、sass命令：依靠環境。
自動編譯命令：（編譯單個文件/編譯整個文件夾）
編譯單個文件
sass文件目錄 sass --watch scss文件的路徑:css文件的路徑 --style expanded
編譯整個文件夾
sass文件目錄 sass --watch scss文件夾/. : css文件夾/. --style expanded
3、gulp編譯
4、hbulid編譯
①工具--預編譯設置
②新建一個預編譯配置 .scss
③輸入觸發命令的地址：ruby裡面的sass.bat地址
④命令參數：%FileName% ../css/%FileBaseName%.css
『叄』 如何一步步實現Web前端開發職業目標
說說自己的經歷吧！
先學HTML，然後是CSS，初學者建議看這方面的視頻，入門後，去W3C上面看基礎。其實HTML+CSS很簡單，入門時間：15天。（每天4小時）
上面的基礎打好了，你自然對編程有一點點的信心了，但上面所學的，不能算編程，因為太簡單了。簡單，但應用面很小，可以做一些靜態網站。
然後是javascript，想精通javascript幾乎不可能，因為他是核心。入門時間，大約30天。先視頻，後去W3C看基礎。javascript的基礎牢固了，你可以開發95%以上的頁面了。當然，這些頁面，只是在本地運行得很好，以後你深入，你就會發覺，很多糟糕的地方了。
不過，你入門javascript之後，你可以算是一個程序員了。
然後是jquery，jquery是專業於DOM操作的。你現在不懂DOM，是你沒接觸javascript，你接觸就明白了。jquery幫你解決了很多的游覽器兼容問題，讓DOM操作簡單很多。jquery其實很簡單，有了javascript基礎，入門不用一個星期。
學完jquery，你可以嘗試挑戰新的技術了，例如ES5、ES6、ES7，ES5其實你不用挑戰，你現在學的javascript用的就是ES5和ES5之前的ES，不過你要粗略看看，因為有很多很多的基礎。再然後是ES6、ES7，這兩個比較難，你用心的看就行，對以後很有幫助。學習這些，至少要30天，甚至更多。
當你了解ES5、ES6、ES7，你就可以學HTML5、CSS3了，當然HTML5和CSS3可以在學習ES之前學，但是我強烈建議沒有天分的人不要去接觸HTML5的canvas，超難的。HTML5想精通很難，但是必須學，至少要會用。CSS3的道理和HTML5差不多，至少要會用。CSS3和HTML5入門，大概20天。
當你學完這些，你接下來，學習移動端開發，裡面涉及很多內容，但不難。
然後是，bootstrap，在學bootstrap的時候，你應該會接觸less和sass，順便把它們學了，有了上面的基礎，bootstrap太簡單了。
再然後是，vueJS，全新的編程風格，對ES6依賴很高。但是vueJS不難，前提你有ES6基礎。
然後看你的情況了，有了上面的基礎，你可以去面試工作了。
工作之後，你可以繼續學習，reactJS，angularJS，nodeJS，關於圖形的JS.....其實你學完前面的，你自己就有心得了，沒必要100%和別人一樣，在工作中夠用就好了。按自己所需，我所說的僅供參考。
最後，我想提醒，你應該關注一下前端的變化，特別是那些庫，變化得很大，以前JQ的UI很流行的，現在越來越不流行了，互聯網變化很大，現在熱門的，以後不一定熱門。下面的鏈接，僅供參考，對你以後有幫助網頁鏈接
『肆』 怎麼使用Less/Sass編譯工具koala
一、SASS調試插件的方法 如需調試功能，請在編譯輸出的時候輸出debug信息，那樣解析的css文件中就會包含debug信息，然後通過firebug或谷歌的調試工具就可以定位到我們編輯的scss文件，而不是解析後的css文件。 如果光做好SASS的准備工作還不夠
『伍』 less文件編譯自動會轉出一個css嗎
是的，如果已經指定了編譯後文件的位置所在，如果沒有css文件，編譯後會自動生成一個css文件在該位置，不管是用less.js還是比如koala之類的編譯工具都是這樣的。
『陸』 sass 用koala怎麼編譯
我最近也在學sass，之前用的是sublime test2，這個編譯器有個好處就是轉譯成css的時候方便，但是終究還是和項目分離，也很麻煩。後來發現只要通過命令行一直監視整個目錄或者文件就方便多了，只要保存，sass就會自動編譯，下面是例子：
監視文件：
sass --watch test.scss:test.css
監視目錄
sass --watch sass(sass目錄):css（css目錄）
滿意的話希望採納啦。。。。
『柒』 用 Koala 編譯 SASS 總是提示錯誤
文件夾的名稱不要有中文吧~~
『捌』 如何安裝使用Koala
使用方法
koala編譯工具 v2.0.4綠色版
第一步：把目錄拖進窗口，或者點擊左上角加號圖標，選擇需要編譯的目錄。添加後，右鍵目錄元素支持更多操作。
第二步：在編輯器中編寫代碼。
第三步：完成!文件保存後，koala會在後台進行編譯。
如何在Koala中開啟調試信息參數：
點擊文件元素，在右側展開的面板中勾選debug info選項。
『玖』 怎麼使用Less/Sass編譯工具koala
一、SASS調試插件的方法
如需調試功能，請在編譯輸出的時候輸出debug信息，那樣解析的css文件中就會包含debug信息，然後通過firebug或谷歌的調試工具就可以定位到我們編輯的scss文件，而不是解析後的css文件。
如果光做好SASS的准備工作還不夠，還需要讓瀏覽器支持SASS。那麼就需要一個瀏覽器的插件才能讓瀏覽器識別SASS，從而方便開發人員進行開發。
如需調試功能，請在編譯輸出的時候輸出debug信息，那樣解析的css文件中就會包含debug信息，然後通過firebug或谷歌的調試工具就可以定位到我們編輯的scss文件，而不是解析後的css文件。(如圖1-1)
圖1-1
如果你的css文件中沒有以@media -sass-debug-info開頭的代碼，說明沒有輸出debug信息。請重新使用koala工具編譯你的scss文件，並確定已經勾選了debug信息這個選項。
在火狐中調試，只需要再下載FireSass→即可。
二、編譯工具koala的安裝
1、進入頁面
2、根據系統下載所需要的koala的版本
3、然後在下載文件夾中安裝下載的EXE文件，即可安裝成功
三、編譯工具koala的優點
1、多語言支持：支持Less、Sass、CoffeeScript 和 Compass Framework。
2、實時編譯：監聽文件，當文件改變時自動執行編譯，這一切都在後台運行，無需人工操作。
3、編譯選項：既可統一設置文件的編譯選項，也可單獨設置某個文件的編譯選項。
4、強大的文件右鍵功能：右鍵文件元素，即可操作打開文件，打開文件目錄，打開輸出文件目錄，設置輸出文件目錄，編譯，刪除六大常用功能。
5、錯誤提示：在編譯時如果遇到語法的錯誤，koala將在右下角彈出錯誤信息，方便開發者定位代碼錯誤位置。
6、跨平台：windows、linux、mac都能完美運行。
7、免費且負責：koala完全免費，而且作者很負責，有什麼問題作者都會及時給予答復，意見什麼的可以直接提交給作者，一般在下一個版本就能得到解決。
『拾』 為什麼帶參數的less用koala編譯成css不成功
你是不是在選擇器裡面引用的啊，less網站上的例子沒有放在具體的選擇器裡面，例如這樣子：body {
.box-shadow(2px, 5px);
}