如何将一个包含较少 css 文件的目录编译为 css？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5691173/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I compile a directory full of less css files to css?
提问by ocoutts
I have a directory full of less css files. What is the best way to compile them to normal css? (for deployment)
我有一个包含较少 css 文件的目录。将它们编译为普通 css 的最佳方法是什么？（用于部署）
Id like to run a command as follows:
我想运行如下命令：
lessc -r less/ css/
where lessc is the less compiler (installed via node package manager)
其中lessc是less编译器（通过节点包管理器安装）
回答by Damian
The way to do this is what bootstrap does - have a file which imports all the others and compile that.
这样做的方法就是引导程序所做的 - 有一个文件可以导入所有其他文件并编译它。
@import "variables.less";
@import "mixins.less";
回答by Dan Noble
You can use the following bash one-liner to compile and all less files in a directory and its subdirectories into a single css file "combined.css":
您可以使用以下 bash one-liner 将目录及其子目录中的所有 less 文件编译为单个 css 文件“combined.css”：
$ find less_directory/ -name '*.less' -exec lessc {} \; > combined.css
Or minified for production:
或缩小生产：
$ find less_directory/ -name '*.less' -exec lessc -x {} \; > combined.css
回答by shakaran
If you want compile multiple less filesinto multiple css filestry this one-liner bash script:
如果你想将多个 less 文件编译成多个 css 文件，试试这个单行 bash 脚本：
for file in *.less; do lessc -x --yui-compress -O2 --strict-imports $file `basename $file`.css ; done
You will get a list of .less.css files after run the command.
运行该命令后，您将获得 .less.css 文件列表。
PS: It addittionaly optimizes (-O2) at maximum, compress (-x) and minifies with YUI Compressor(--yui-compress) with strict import evaluation (--strict-imports).
PS：它还最大程度地优化（-O2），压缩（-x）并使用YUI 压缩器（--yui-compress）和严格的导入评估（--strict-imports）进行缩小。
EDITED: For new YUI Compressor versions skip -02 and --yui-compress deprecated, so:
已编辑：对于新的 YUI Compressor 版本，跳过 -02 和 --yui-compress 已弃用，因此：
for file in *.less; do lessc -x --strict-imports $file `basename $file`.css ; done
回答by iloveitaly
This bash script works for me:
这个 bash 脚本对我有用：
find "$PWD" -name '*.less' | while read line; do
REPLACE=`echo $line | sed "s|\.less|\.css|"`
# echo "$line --> $REPLACE"
(lessc "$line" "$REPLACE" &)
done
回答by Sam Stern
I made this VERY simple bash script to compile all LESS files in a directory to CSS
我制作了这个非常简单的 bash 脚本来将目录中的所有 LESS 文件编译为 CSS
#/bin/bash
echo "Compiling all LESS files to CSS"
for file in *.less
do
FROM=$file
TO=${file/.*/.css}
echo "$FROM --> $TO"
lessc $FROM $TO
done
回答by Reorx
I just made the script on top of @iloveitaly's work:
我刚刚在@iloveitaly 的工作基础上编写了脚本：
#!/bin/bash
# file name: lesscdir
if [[ -z || -z ]];then
echo 'both arguments are needed'
exit
fi
find -name '*.less' -printf '%P\n' | while read name; do
FROM=$(echo '/'$name)
TO=$(echo '/'$name | sed "s|\.less|\.css|")
TO_DIRNAME=$(dirname $TO)
if [ ! -e $TO_DIRNAME ];then
mkdir -p $TO_DIRNAME
fi
echo 'Compiling' $FROM '->' $TO
lessc $FROM $TO
done
and then:
进而：
$ chmod +x lesscdir
$ sudo ln -s $(readlink -f lesscdir) /usr/local/bin/
Although I like python the best and solve most problems with it, it's still very happy to use bash in linux environment.
虽然我最喜欢python并且用它解决了大部分问题，但是在linux环境下使用bash还是很开心的。
回答by ocoutts
I have written a hackish script that solves the problem:
我写了一个hackish脚本来解决这个问题：
#!/usr/bin/env python
#This is responsible for "compiling" less.css files to regular css files for production. It also minifies the css at the same time.
#Usage: give it a start directory as the first parameter and an end directory as the second parameter. It will recursivly run the appropriate command for all css files in the first subdirectory.
import os
import sys
import re
if len(sys.argv) < 3:
sys.exit('ERROR: Too many paths!! No less css compiled')
if len(sys.argv) > 3:
sys.exit('ERROR: Not enough paths!! No less css compiled')
start_dir=os.path.join(os.getcwd(),sys.argv[1])
end_dir=os.path.join(os.getcwd(),sys.argv[2])
pattern=r'\.css$'
pattern=re.compile(pattern)
files_compiled=0
def copy_files(start, end, add=''):
global files_compiled
try:
os.mkdir(end)
except:
pass
for folder in get_immediate_subdirectories(start):
copy_files(os.path.join(start,folder), os.path.join(end+folder), add+folder+'/')
for less in os.listdir(start):
if pattern.search(less):
os.system('lessc -x %s > %s'%(start+less,end+less))
print add+less
files_compiled=files_compiled+1
def get_immediate_subdirectories(dir):
return [name for name in os.listdir(dir)
if os.path.isdir(os.path.join(dir, name))]
Ideally there is a better solution.
理想情况下有更好的解决方案。
回答by Jessie A. Morris
Recently I've been experiencing issues with running something like
最近我遇到了运行类似的问题
lessc directory/*.less foo.css
Instead of taking the different LESS's and outputting them into foo.css it would modify the second file in the list. This is not OK with me.
它不是采用不同的 LESS 并将它们输出到 foo.css 中，而是修改列表中的第二个文件。这对我来说不好。
To solve this problem, I made a new less frontend called lessm.
为了解决这个问题，我创建了一个名为lessm.
You can check it out at https://github.com/jive/lessm.
您可以在https://github.com/jive/lessm 上查看。
The way you'd use it is
你使用它的方式是
lessm foo.less foo2.less ../bar/bazz.less -o output.css
回答by Paul-Armand Verhaegen
Based shakaran's answer, but instead of .less.css files, it creates .css files (don't use less in the filename, well only in the extension that is):
基于 shakaran 的答案，但不是 .less.css 文件，而是创建 .css 文件（不要在文件名中使用 less，只在扩展名中使用）：
for file in *.less; do lessc -x --strict-imports $file `basename $file | sed -e "s/less/css/"` ; done
回答by Gustavo Cavalieri Fernandes
Just found an awesome npm moduleto do that ! :)
刚刚找到了一个很棒的npm 模块来做到这一点！:)
Install it:
安装它：
$ npm install [-g] lessc-each
Run it:
运行：
$ lessc-each ?dir1? ?dir2?
Where ?dir1?is the directory of Less files to compile, and ?dir2?is the directory for output files. If ?dir2?does not exist, it will automatically be created. Both directories must be relative to the current path of the command line.
哪里？dir1？是要编译的Less 文件的目录，而?dir2? 是输出文件的目录。如果？dir2？不存在，会自动创建。两个目录都必须相对于命令行的当前路径。
