1

我目前正在考虑在我当前的项目中从使用 css 更改为LESS 。在我回答这个问题之前要提到的几件事是：

1）该项目是纯粹的客户端（Html / Js / Css），因此网站没有服务器端组件（尽管它通过CORS调用了一个Web服务）2）我通过资源加载框架加载几乎所有内容，目前我是使用 yepnope

因此，鉴于上述情况，我需要能够在客户端处理 LESS 样式，但是由于我使用的是资源加载器，并且在初始页面加载发生后可以加载更多的 css/less，我想知道是否：

1) 使用客户端处理时，Less 是否与内容加载器一起使用？正如它所说：

Client-side usage

Link your .less stylesheets with the rel set to “stylesheet/less”:

<link rel="stylesheet/less" type="text/css" href="styles.less">
Then download less.js from the top of the page, and include it in the <head> element of your page, like so:

<script src="less.js" type="text/javascript"></script>
Make sure you include your stylesheets before the script.

我想我也许可以告诉 yepnope 如何处理更少的文件并为它们提供所需的元素属性。如果我可以在更少的javascript之前提供更少的资源，可以吗？

2) 有没有手动方法告诉它在 javascript 中处理什么？

这将涵盖为当前页面加载所有内容的情况，用户单击一个按钮，该按钮动态加载显示在当前页面中的新模板，这可能需要加载新的更少资源，但 less.js 文件已经包括在内了。

希望以上内容为您提供了一些关于我正在尝试做什么以及这两个问题是什么的背景信息。

4

1 回答 1

1

是的你可以。

阅读这篇文章动态加载 less.js 规则并进行一些调整：

less.sheets.push(document.getElementById('new-style-1'));
// Add the new less file to the head of your document    
var newLessStylesheet = $("<link />").attr("id", "new-style-1").attr("href", "/stylesheets/style.less").attr("type", 'text/less');
$("head").append(newLessStylesheet);
// Have less refresh the stylesheets
less.refresh(true);

您还可以在开发环境中生成所有 CSS 并将其放在一个文件中。有很多选择。最简单的方法是使用应用程序。您可以在 Mac上使用http://incident57.com/less/ 之类的应用程序。您甚至可以在线编译：搜索“lessphp”。

于 2012-02-23T10:50:11.383 回答