[心得] 編譯Bootstrap與安裝less (Windows)

作者: Prius (H-H-H-H-H-H-H-H-H-H-H-H)   2014-01-19 11:48:37
寫給新手,這是一篇保證Workable的安裝與設定腳本。
基本觀念:Bootstrap是用Less語法寫的;Less又是基於Node.js來開發。
因此,要能夠編譯Bootstrap,要先安裝Node.js。
以下是完整的安裝步驟,示範如何自定Bootstrap的Namespace,避開
CSS衝突。
範例是在Windows上操作,不過,在Linux上也是相同的程序,也可以Work。
1. Download Nodejs from http://nodejs.org/
2. Install Nodejs
3. 退出;重新開啟 Command Line Prompt <== 這樣子 Path 才會包括
新安裝的 Node.js 目錄
4. 執行 C:\>npm install less <== Npm是Node Package Manager,執行
這行電腦會自動下載less並完成安裝
5. 下載 Bootstrap Source from http://getbootstrap.com/
6. 解壓縮到指定目錄,例如:D:\bs
7. C:\>d:
D:\>cd bs\bootstrap-3.0.3
D:\bs\bootstrap-3.0.3>Notepad myNamespace.less
8. 在Notepad裡輸入以下,並儲存
.bs {
@import "less/bootstrap.less";
}
9. 編譯
D:\bs\bootstrap-3.0.3>lessc myNamespace.less > myBootstrap.css
10. OK搞定
作者: uranusjr (←這人是超級笨蛋)   2014-01-19 12:32:00
其實 Bootstrap 現在有 SASS 版了
作者: jokester (蠻王科科)   2014-01-19 14:33:00
其實我都下編譯好的css和js來用@@
作者: timTan (用口頭禪區分年記)   2014-01-19 16:52:00
幫補充,less 去年開始有繼承語法客製bootstrap 變輕鬆了

Links booklink

Contact Us: admin [ a t ] ucptt.com