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>