在 mac os x 中自动编译 less css 文件

发布于 2024-12-15 00:14:49 字数 451 浏览 5 评论 0原文

我已经开始减少使用 CSS。

我编写了一个小的 bash 脚本，它使用我的目标文件调用“lessc”命令，然后将其通过管道传输到我完成的 css 文件中。它看起来像这样：

#!/bin/bash
lessc ~/Documents/Development/Projects/blog/static/css/global.less --watch > ~/Documents/Development/Projects/blog/static/css/styles.css -x

这个 -x 标志压缩 CSS。

正如你所看到的，我尝试使用 --watch 标志，根据我的理解，这意味着每次你对 less 文件进行更改时，它都会自动重新编译 CSS。但这似乎不起作用。

我意识到我可以使用某人编写的“less 应用程序”，但我很好奇自己如何做到这一点，因为这显然是可能的。

原文

I have started using less CSS.

I have written a small bash script which calls the "lessc" command with my target file and then pipes it into my finished css file. It looks something like this:

#!/bin/bash
lessc ~/Documents/Development/Projects/blog/static/css/global.less --watch > ~/Documents/Development/Projects/blog/static/css/styles.css -x

This -x flag compresses the CSS.

As you can see I have tried to use the --watch flag which from what I understood would mean it would automatically recompile the CSS every time you make a change to the less files. But this doesnt seem to work.

I realise I could use the "less app" that someone has written, but Im curious as to how to do this myself, as it's clearly possible.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

源来凯始玺欢你 2024-12-22 00:14:49

因为很少使用@imports，所以它是一个过度设计的解决方案来监视所有涉及的文件。您可以经常使用一个简单的循环来编译，例如：

while true; do lessc bootstrap.less > bootstrap.css 2> /dev/null; sleep 5; done

如果这太简单了，那么您可以尝试在 Bash 中使用 -nt 测试，它测试一个文件的 mtime 是否比另一个文件更新（假设bootstrap.less 包含 custom.less 的 @import）：

while true
do
    if [ bootstrap.less -nt bootstrap.css ] || [ custom.less -nt bootstrap.css ]; then
        echo "Change detected, regenerating @ $(date)"
        lessc bootstrap.less > bootstrap.css
    fi
    sleep 5
done

Because less often uses @imports, it's an over-engineered solution to watch all the files involved. You can just use a simple loop to compile every so often, for example:

while true; do lessc bootstrap.less > bootstrap.css 2> /dev/null; sleep 5; done

If this is too simplistic, then you could try using the -nt test in Bash, which tests if a file's mtime is newer than the other, for example (supposing bootstrap.less contains an @import for custom.less):

while true
do
    if [ bootstrap.less -nt bootstrap.css ] || [ custom.less -nt bootstrap.css ]; then
        echo "Change detected, regenerating @ $(date)"
        lessc bootstrap.less > bootstrap.css
    fi
    sleep 5
done

回复收藏 0 原文

~没有更多了~