less学习-浏览器端编译(一)
demo地址 http://www.qq210.com/shoutu/android
1.下载less包,官网
2.引入less文件
<link rel="stylesheet/less" type="text/css" href="test.less" />
3.引入config.js
3.引入less.js
4.less.watch();开启观察者模式,
config.js
less = { env: "development", // or "production" async: false, // load imports async fileAsync: false, // load imports async when in a page under // a file protocol poll: 10000, // when in watch mode, time in ms between polls functions: {}, // user functions, keyed by name dumpLineNumbers: "all", // "comment" or "mediaQuery" or "all" relativeUrls: false, // whether to adjust url's to be relative // if false, url's are already relative to the // entry less file rootpath: ":/" // a path to add on to the start of every url //resource };
test.html
<!DOCTYPE html> <html> <head> <title>hah</title> <link rel="stylesheet/less" type="text/css" href="test.less" /> <link rel="stylesheet/less" type="text/css" href="test2.less" /> <script src="./config.js"></script> <script src="dist/less.js"></script> <script>less.watch();</script> </head> <body> <div class="box"> 你好 </div> </body> </html>