在學任何東西之前, 我就是有個習慣, 先搞定這個東西最最簡單的使用方法. 然後在
深入學習, 毫無疑問hello-world一直是那麼簡單.
較新版的高階瀏覽器.
wamp環境.
less.js檔案
本人的環境:
google chrome 60.0
wampserver 3.0.6
less 2.7.2
wampserver是乙個php整合開發環境, 我們用來它來模擬本地伺服器環境, 也可以換成
其它類似的本地伺服器環境. 即便是前端開發沒本地伺服器環境也是不行的, 比如cookie,
ajax這些都是在伺服器環境中才能執行, 而less由於cors同源策略的問題也需要在本地
伺服器環境中執行.
首先在wamp的www目錄下建立如下資料夾結構.
less_demo
hello.less
hello-world.html
hello.less檔案內容如下:
@red: red;
#hello
hello-world.html檔案內容如下:
hello-world
hello-world.html的內容有幾點需要說明:
link的rel值是stylesheet/less
在第一次出現的script標籤裡面, 寫的**是less的配置檔案,
env: "development"代表啟用開發模式, 這段不是必須的可省略. 跟多關於瀏覽器端配置
的說明可以參考官方的browser options
上述檔案的引入順序, 不能換, 必須是link, 配置檔案, less.js這個順序.
在瀏覽器中輸入http://localhost/res/less_demo/hello-world.html執行.
如果檔案結構和我的不同, 可自行修改.如果我們沒有,正確在本地伺服器端執行. 由於瀏覽器禁止操作本地檔案, 將出現
cors錯誤. 提示錯誤圖如下:
如果一切ok, 則執行正確, 效果圖如下:
可以看到, 控制台輸出一些除錯資訊. 該資訊只有在配置成開發模式才會出現.
less cdn
less official site
less 中文網
Less配置環境
一 安裝sublime 外掛程式 1.安裝less外掛程式 ctrl shift p install package 輸入less按enter 2.安裝less2css外掛程式 ctrl shift p install package 輸入less2css按enter 作用 當儲存less檔案的時候...
struct （指標題）不能正確輸出hello
struct data3 t pdata struct data3 t str printf data s s n str.data,char pdata data 0 struct data2 t pdata struct data2 t str printf data s s n str.dat...
WebStorm 8 0安裝LESS編譯環境的教程
1 首先安裝webstorm 8.0 2 安裝nodejs nodejs官方版本有32位和64位，可以根據實際需要進行選擇安裝。3 安裝less 安裝成功的介面是這樣的 如圖 在這裡，我們能夠看到lessc安裝的目錄，這個要先記下來。4 在webstorm裡面配置less編譯 這個步驟稍微複雜一些，...