lesscss导入和观看

本文介绍了lesscss导入和观看的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我有两个文件: 黑色的

/* imports */ @import "elements.less"; @import "crush.less"; @import "tree.less";

我通过添加以下功能来使用少看功能:

less.watch();

果然，我可以看到路况变得越来越黑.不过Black.less尚未更改，因此导入的任何文件中的任何更改都不会被视为更改，并且样式不会更新.

但是，如果我触摸黑色，那么样式就会按需更新.

有没有一种自动更新的方法，而不管它是导入到页面上的文件还是实际添加到页面上的文件少的文件，也就是说，我只需要更改就可以了，比如tree.less.

/K

解决方案

我使用 Grunt 和 grunt-contrib-less插件监视我所有的文件，并在它们更改时将它们编译为CSS. /p>

然后，我在浏览器中使用 live.js 来观看CSS文件.

这样做的好处是我可以对HTML和JS文件进行相同的操作，还可以运行测试，对JS文件进行整理等.

I have two files: black.less

/* imports */ @import "elements.less"; @import "crush.less"; @import "tree.less";

I'm using the less watch functionality by adding:

less.watch();

Sure enough I can see the traffic getting black.less. Black.less hasn't changed though so any change in any of the files being imported is not counted as a change and the style is not updated.

If I however touch black.less the style updates as it should.

Is there a way to automatically update regardless of if it's an imported file or the actual less file being added to the page i.e. so that I only have to change let's say tree.less.

/K

解决方案

I use Grunt and the grunt-contrib-less plugin to watch all of my less files and compile them into CSS as they change.

Then I use live.js in the browser to watch the CSS files.

The advantage to doing it this way is that I can do the same thing with my HTML and JS files, as well as run tests, lint my JS files, etc.