是否可以显示 Less.js 生成的 CSS？
我有以下页面:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Less</title>
<link rel="stylesheet" type="text/less" href="test.less">
<script type="text/javascript">
less = {
env: "development", // or "production"
async: false, // load imports async
fileAsync: false, // load imports async when in a page under
// a file protocol
poll: 1000, // when in watch mode, time in ms between polls
functions: {}, // user functions, keyed by name
dumpLineNumbers: "comments", // 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.com/"// a path to add on to the start of every url
//resource
};
</script>
<script src="less-1.5.0.min.js" type="text/javascript"></script>
</head>
<body class="default">
<script>
console.log(less);
</script>
</body>
</html>
CSS 工作正常，但我想看看“实际” 生成的 CSS 文件是什么样的。我在对象 less 中看不到任何似乎包含它的东西......
最佳答案
来自 LESS - The dynamic stylesheet language.
Debugging
It is possible to output rules in your CSS which allow tools to locate the source of the rule.
Either specify the option dumpLineNumbers as above or add !dumpLineNumbers:mediaQuery to the url.
You can use the “comments” option with FireLESS and the “mediaQuery” option with FireBug/Chrome dev tools (it is identical to the SCSS media query debugging format).
快速浏览 https://github.com/less/less.js/blob/master/dist/less-1.5.1.js在第 6344 行显示 function createCSS(styles, sheet, lastModified)。从这个函数，我会说 less 创建一个 style 元素，生成的 CSS 放置在该元素中。所以，这样的事情可能会奏效
var css = $('style').text();
console.log(css);
关于css - 显示从 Less.js 创建的 CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20349316/