Question

我已经开始使用meteor，并想知道什么是迁移引用许多CSS文件的HTML文件的好方法。到目前为止，我发现meteor将按字母顺序自动加载所有CSS文件。我的两个问题如下：

我应该在哪里找到CSS文件？（或者我可以控制加载哪些目录）
是否可以按特定顺序加载特定的CSS文件？

以下是我在迁移到meteor之前在HTML文件中的当前引用。

    <!-- Web Fonts  -->
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">

    <!-- Libs CSS -->
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/fonts/font-awesome/css/font-awesome.css">
    <link rel="stylesheet" href="vendor/owl-carousel/owl.carousel.css" media="screen">
    <link rel="stylesheet" href="vendor/owl-carousel/owl.theme.css" media="screen">
    <link rel="stylesheet" href="vendor/magnific-popup/magnific-popup.css" media="screen">

    <!-- Theme CSS -->
    <link rel="stylesheet" href="css/theme.css">
    <link rel="stylesheet" href="css/theme-elements.css">
    <link rel="stylesheet" href="css/theme-animate.css">

    <!-- Current Page Styles -->
    <link rel="stylesheet" href="vendor/rs-plugin/css/settings.css" media="screen">
    <link rel="stylesheet" href="vendor/circle-flip-slideshow/css/component.css" media="screen">

    <!-- Skin CSS -->
    <link rel="stylesheet" href="css/skins/blue.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="css/custom.css">

    <!-- Responsive CSS -->
    <link rel="stylesheet" href="css/theme-responsive.css" />

感谢您的帮助！：）

Answer 1

没有必要在流星中提供样式表的参考。只需将您的css文件放在client / stylesheets文件夹中即可。 Meteor将自动应用这些css规则。

Answer 2

如@imslavko所述，您可以在https://guide.meteor.com/structure.html

找到Meteor行为

但是这些规则与.js代码和.html模板文件更相关：Meteor合并并最小化单个文件中的所有.css（只要它们由您提供而不是在CDN上）所以你会在<link rel="stylesheet">中找到一个<head>引用。

请记住将所有前端文件放在client文件夹中，以避免不必要的服务器加载和可用性。

因此，您可以为.css文件选择方便的文件夹结构，例如将它们全部放在client/stylesheets中，或使用其他子文件夹来更好地管理它们。

如何在Meteor中使用多个CSS文件

2 个答案: