css - 为 Meteor 中的特定页面加载特定的 css 文件

Question

我有 3 个页面 x、y、z 和 3 个 CSS 文件 c1、c2、c3

现在，如果我想为页面 x 包含 c1 和 c2 CSS 文件，而不是包含所有三个 CSS 文件 c1、c2 和 c3。

我们如何在 meteor 框架中实现这一目标？

Answer 1

如 similar 中所述questions , Meteor 在部署时将所有 CSS 捆绑在一起，因此要解决此问题，您需要使 CSS 对 Meteor 不透明并自行加载。一种快速而肮脏的方式:

• 将样式表移至元素的 /public文件夹 ( more info here )

• 添加<script>到每个相关模板(比如在 x.html 中)以根据需要注入(inject) CSS:

  $(document).ready(
$('head').append($("<link rel='stylesheet' href='c1.css' type='text/css' />"))
);

你也可以在没有 jQuery 的情况下实现这一点，但一般来说，像这样的解决方案不会很漂亮，并且可能会因样式的延迟加载而导致 UI 闪烁，因此你应该考虑是否真的有必要在你的应用。