We are building a large site which requires very modular CSS. The problem we have is that we like using the @import statement as it's very clean, but the major downside is the performance (all CSS files referenced are loaded synchronously i.e. not in parallel).
我们正在构建一个需要非常模块化CSS的大型站点。我们遇到的问题是我们喜欢使用@import语句,因为它非常干净,但主要缺点是性能(引用的所有CSS文件都是同步加载的,即不是并行加载)。
Does anyone know of a way to use PHP (or even .htaccess) to find any CSS files referenced via @import and then generate a single CSS file?
有没有人知道使用PHP(甚至.htaccess)查找通过@import引用的任何CSS文件然后生成单个CSS文件的方法?
I've looked at loads of examples (some of which are seen here): http://robertnyman.com/2010/01/19/tools-for-concatenating-and-minifying-css-and-javascript-files-in-different-development-environments/ but none of them work with @import.
我看了很多例子(其中一些可以在这里看到):http://robertnyman.com/2010/01/19/tools-for-concatenating-and-minifying-css-and-javascript-files-in -different-development-environments /但它们都不适用于@import。
Thanks.
4 个解决方案
#1
1
Less can do that: http://lesscss.org/#-importing
少可以做到:http://lesscss.org/#-importing
Maybe sass also, but I'm not sure
也许是sass,但我不确定
#2
0
Using assetic to manage CSS and JavaScript does miracles. It is proposed by default when using Symfony2, but can be used as a standalone library in PHP. If used correctly, it will let you use your files in their original format while debugging and concatenate/minify everything in production.
使用assetic来管理CSS和JavaScript创造了奇迹。在使用Symfony2时默认提议,但可以在PHP中用作独立库。如果使用正确,它将允许您在调试和连接/缩小生产中的所有内容时以原始格式使用文件。
https://github.com/kriswallsmith/assetic
I have not had any issues with @import.
我对@import没有任何问题。
It will also let you use those alternative CSS languages if that is something you are into.
它也可以让你使用那些替代CSS语言,如果你是这样的话。
#3
0
use compass. it compiles all of your styles into one file.
用罗盘。它将您的所有样式编译成一个文件。
compass-style.org
#4
0
You could use the PHP version of LESS. It will process the styles in a style file and those imported, into one file within the server itself. You can minimize it too. Then store it in a cache. This will enable the LessPHP compiler to see if the processed file is already in the cache, and whether any of the involved style files have been changed. If nothing has changed, it will simply return the cached style file. The only difference you will need to do in the markup will be to change .css to .less in the <link> tag. Also this will help you to write LESS css, which is a bonus.
您可以使用PHP版本的LESS。它会将样式文件中的样式和导入的样式处理到服务器本身的一个文件中。你也可以减少它。然后将其存储在缓存中。这将使LessPHP编译器能够查看已处理的文件是否已在缓存中,以及是否已更改任何相关的样式文件。如果没有任何改变,它将只返回缓存的样式文件。您需要在标记中做的唯一区别是在 标记中将.css更改为.less。这也将帮助你写出LESS css,这是一个奖励。
The detailed documentation on how to do install LessPHP, auto-compile and cache the LESS files are given in the official website and on GITHub.
有关如何安装LessPHP,自动编译和缓存LESS文件的详细文档在官方网站和GITHub上提供。
#1
1
Less can do that: http://lesscss.org/#-importing
少可以做到:http://lesscss.org/#-importing
Maybe sass also, but I'm not sure
也许是sass,但我不确定
#2
0
Using assetic to manage CSS and JavaScript does miracles. It is proposed by default when using Symfony2, but can be used as a standalone library in PHP. If used correctly, it will let you use your files in their original format while debugging and concatenate/minify everything in production.
使用assetic来管理CSS和JavaScript创造了奇迹。在使用Symfony2时默认提议,但可以在PHP中用作独立库。如果使用正确,它将允许您在调试和连接/缩小生产中的所有内容时以原始格式使用文件。
https://github.com/kriswallsmith/assetic
I have not had any issues with @import.
我对@import没有任何问题。
It will also let you use those alternative CSS languages if that is something you are into.
它也可以让你使用那些替代CSS语言,如果你是这样的话。
#3
0
use compass. it compiles all of your styles into one file.
用罗盘。它将您的所有样式编译成一个文件。
compass-style.org
#4
0
You could use the PHP version of LESS. It will process the styles in a style file and those imported, into one file within the server itself. You can minimize it too. Then store it in a cache. This will enable the LessPHP compiler to see if the processed file is already in the cache, and whether any of the involved style files have been changed. If nothing has changed, it will simply return the cached style file. The only difference you will need to do in the markup will be to change .css to .less in the <link> tag. Also this will help you to write LESS css, which is a bonus.
您可以使用PHP版本的LESS。它会将样式文件中的样式和导入的样式处理到服务器本身的一个文件中。你也可以减少它。然后将其存储在缓存中。这将使LessPHP编译器能够查看已处理的文件是否已在缓存中,以及是否已更改任何相关的样式文件。如果没有任何改变,它将只返回缓存的样式文件。您需要在标记中做的唯一区别是在 标记中将.css更改为.less。这也将帮助你写出LESS css,这是一个奖励。
The detailed documentation on how to do install LessPHP, auto-compile and cache the LESS files are given in the official website and on GITHub.
有关如何安装LessPHP,自动编译和缓存LESS文件的详细文档在官方网站和GITHub上提供。