最少的CSS和WordPress主题CSS标头

Question

我正在开发WordPress主题，并将LESS用于CSS。 LESS具有许多动态解决方案，我发现它们在整个项目中都很有帮助。 我正在使用LESS，但不是直接使用，而是将LESS文件编译为CSS，并将它们（.css）放入站点<head> 。 要编译LESS文件，我使用的是WinLESS（v。1.8.1），它是一种出色而又快捷的工具。 它具有内置的最小化技术，因此单击一下即可（1）编译LESS文件，以及（2）立即缩小它们。 为了确保网站速度，我希望使用CSS的缩小版本。 但...

但是，我们都知道WordPress主题CSS文件的标题包含主题信息，例如：

/*
Theme Name: my theme
Theme URI: http://www.example.com/
Description: my theme description
Author: you
Author URI: http://www.example-author.com/
Version: 1.0
*/

如果我命令WinLESS编译我的style.less到Compile && Minify那么我得到了style.css的缩小版本，但是您知道缩小的CSS不包含任何CSS注释，因此主题信息只是被过程吹散了。 在wp-admin/themes.php页面中，主题变为无标题（未命名）。

然后我尝试了一些不同的东西。 我将样式表分为两个文件：

style.less 仅包含主题所需的标题信息， style.less
my-site.less包含所有站点CSS

我正在将style.css编译为my-site.css ，但将my-site.css为my-site.css 。 在style.less我包含或获取my-site.css所有CSS my-site.css包含：

@import (less) 'css/my-site.css`;

因此，将缩小的my-site.css完全导入到style.css文件中（那里没有 @import CSS参数）。 它们将像常规CSS代码一样逐行包含在其中，并包含[ (less) ] [ 详细信息 ]。

问题...
这实际上是问题所在。 虽然我要导入一个缩小的CSS文件，但是LESS @import (less)会将声明作为一行一行。

我的my-site.css是这样的：

*{margin:0;padding:0}html{margin:0;padding:0}

当我打开style.css文件时，它就像：

* {
  margin: 0;
  padding: 0;
}
html {
  margin: 0;
  padding: 0;
}

进口完全消失了。

还有其他解决方法，可以将@import CSS代码转换为样式表以使其最小化？

PS：我完全了解WP-Minify插件（一个不错的插件），我实际上并不希望直接使用它。

Answer 1

WinLess使用YUI压缩器进行压缩。 （特别是，我认为WinLess使用LESS.js，它使用YUI压缩。）因此，您可以使用特定的起始注释样式- /*! 向Minifier提示应保留评论：

/*!
Theme Name: my theme
Theme URI: http://www.example.com/
Description: my theme description
Author: you
Author URI: http://www.example-author.com/
Version: 1.0
*/

WordPress仍应识别块注释并使用主题信息。

请参阅YUI压缩机文档的“特殊注释”部分。

最少的CSS和WordPress主题CSS标头

问题描述

1 个解决方案

解决方案1
5 已采纳 2013-12-07 14:17:22

最少的CSS和WordPress主题CSS标头

问题描述

1 个解决方案

解决方案1 5 已采纳 2013-12-07 14:17:22

解决方案1
5 已采纳 2013-12-07 14:17:22