2014-07-07 27 views
2

目前我只是对我的网站做了less.js解决方法。它工作正常。 假设代码如下所示。less.js的工作方式

<html> 
<head> 
<link rel="stylesheet/less" type="text/css" href="styles.less" /> 
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/1.7.3/less.min.js"></script> 
</head> 
<body> 
    ... 
</body> 
</html> 

当我更新styles.less文件时,只需刷新页面即可。 Less.js将编译较少的文件并应用于页面。但我只是想知道编译后的css文件存储在哪里?我也想知道less.js是否调用lessc来编译少文件?

谢谢。

回答

1

在您给出的设置(HTML页面)中,您让客户担心解释少于文件。

确切地说,浏览器加载您链接到的JavaScript库,然后这个JavaScript解释styles.less文件。

实际的css文件没有存储在服务器上,因为它是所有浏览器端的工作,我怀疑浏览器将它存储在除RAM之外的其他地方。


虽然这听起来不太好。我们,拥有高端服务器的慷慨的网站所有者喜欢尽可能提升客户端的计算能力。我们不想让没有必要的iPhone用户电池电量不足。

或者,您在完成编辑后在样式文件上运行lessc styles.less > styles.css。然后直接在HTML中使用styles.css,也从HTML中删除less.js


问题你可能想问:如何编译为css自动然后呢?

有几种解决方案:

  • 自动化少文件的编译就可以被改变,使用一些软件来观看一个文件或目录。
  • 您正在使用的编辑器可能有编译较少功能,或者作为扩展名添加。
  • 您可能想要考虑使用Web框架的策略。仅仅编译少一点就太过分了,但是如果你从web框架中获得其他优势,或者已经在使用它 - 这是一个不错的选择。使用较少的中间件和Express框架的example
+0

你并不需要一个完整的框架来自动处理LESS文件。这主要是使用正确的编辑器的问题,或者设置其他类型的* watcher *,每次更改它时都会自动编译该文件。为了这一点,将一切都移到某个框架上有点矫枉过正。该文件只需在开发过程中编译一次,而不是在Web服务器上编译。 – deceze

+0

@deceze完全同意你的意见。我的意思是他可能想开始使用Web框架,因为它的其他优势也可能帮助他取决于他在做什么。修改答案,以更好地概述自动化选项。感谢您指出。 – alandarev

+0

@alandarev感谢你的文章,你说'客户解释Less文件'。我不确定它是什么意思,这是否意味着浏览器解释Less文件?如果是这样,我不同意你的看法。在我的理解。如果我使用less.js。编译少的工作应该发生在服务器上。因为我只在服务器上安装nodejs。没有必要为所有类型的客户安装较少的软件包。服务器将返回Less文件http请求的编译后的css代码。是对的吗 ?请帮助验证它。谢谢。 –

0

我知道这样的:javascript从'link'标签读取较少的文件,然后解析到'style'标签的html页面中,您应该使用浏览器调试工具查看它(它的动态当你关闭页面然后样式标签将会清洗)。