2

我正在使用 CakePHP 来构建我的网站（如果重要的话）。我有大量的元素/模块，每个都有自己的文件和相当复杂的 CSS（在某些情况下）。

目前 CSS 位于一个巨大的单个 CSS 文件中，但为了理智（以及下面提到的细节），我希望能够将 CSS 保存在它自己的相应文件中 - 即css/modules/rotator.css. 但是对于普通的 CSS，这将调用大量的 CSS 文件。

因此，我开始根据推荐研究 SASS 或 LESS。但是 - 似乎这些应该被编译然后上传。但在我的情况下，每个页面都可以通过 CMS 进行编辑，因此一个页面可能一分钟有 10 个模块，然后在 CMS 更改后它可能有 20 或 5 个......等等。如果它不打算使用它，我不想为每个模块编译 CSS。

有没有办法让大量的 CSS 文件都可以即时编译？

旁注：我还希望允许用户为页面和/或模块编辑自己的 CSS，然后在默认 CSS 之后加载。这对 SASS 和/或 LESS 可行吗？

我不需要完整的演练（尽管那会很棒），但到目前为止，我的搜索已经返回了与 Ruby on Rails 相关的东西（从未使用过）或每种 CSS 语言的通用教程。

欢迎任何其他建议。我是一个完整的 SASS/LESS 菜鸟。

澄清问题：

如何使用 LESS 动态（服务器端）组合多个 CSS 文件？（即使是一个能让我走上正轨的资源链接也足够了！）

4

4 回答 4

6

如果你想减少 CSS 文件的数量并且你有一个包含所有组件 css 的巨大 css 文件，只需在所有页面上链接到它并确保正确设置缓存标题。

他们将加载文件一次并在任何地方使用它。一个陷阱是初始页面加载时间。如果这不是问题，请使用此解决方案。如果这是一个问题，请考虑将已编译的 CSS 文件分解为几个主要块（default.css、authoring.css、components.css 等）。

不要费心尝试为每个组件集合制作自定义 CSS，您实际上会通过强迫用户重新下载以不同方式重新组织的相同 CSS 来打自己的脚。

于 2013-03-21T14:13:57.490 回答
3

查看lessphp（http://leafo.net/lessphp/）。这是一个less的php实现，可以通过比较时间戳来重新编译更改的文件。

于 2013-03-21T14:07:31.970 回答
1

假设“on the fly”意味着“on pageload”，那可能比发送多个文件还要慢。我建议在保存模块时重新编译样式表。

于 2013-03-21T14:00:38.400 回答
0

只需要必要的模块的问题应该通过 CMS 来解决。它与 SASS 或 LESS 无关。

如果您的 CMS 知道当前页面有哪些模块，请不要运行 SASS/LESS 编译（除非您实现缓存，否则它会非常缓慢，这不是一项简单的任务）。相反，调整 CMS 的逻辑，使其包含每个模块的 CSS 文件。

像Drupal这样的高级 CMS不仅会自动获取必要的 CSS 文件，而且还会将它们组装成一个文件并进行压缩。

如果您的 CSS 不知道当前页面有哪些模块（例如，“模块”只是保存在帖子正文中的 HTML 代码），那么您实际上什么也做不了。

UPD：正如Sequoia mcdowell在他的回答中所说，让用户下载一个大的 CSS 文件一次比让他们下载一些包含重复代码的较小的 CSS 文件要好。所有这些较小 CSS 文件的累积大小将大于完整 CSS 文件的大小。

于 2013-03-23T19:28:57.737 回答