gpt4 book ai didi

meteor - 如何在 Meteor 1.0 中有条件地加载/捆绑 CSS 文件?

转载 作者:行者123 更新时间:2023-12-01 03:45:32 26 4
gpt4 key购买 nike

我知道以前有人问过这个问题,但我想知道随着 1.0 的出现是否发生了一些变化。

我不希望 Meteor 自动将我的应用程序中的每个 CSS 文件捆绑在一起。我的管理页面将拥有与面向客户端的页面完全不同的 CSS,并且使用命名空间似乎是一个非常复杂的解决方案。如何让 Meteor 在某些页面上加载某些 CSS 文件而不在某些页面上加载某些 CSS 文件?

同样的问题也适用于 JS 文件。

我知道有人说这很有用:

https://github.com/anticoders/meteor-modules

对这个包的条件 CSS 和 JS 有什么评论吗?

最佳答案

您可以将 CSS 文件放在/public 下的某个位置,并在需要时从模板中手动包含它们。/public 下的所有内容都不会被捆绑,并且 URL 将删除/public,例如

  • 创建两个文件:your_meteor_project/public/one.css 和......./two.css。您的客户可通过 http://example.com/one.css 获取这些信息。 (即“公共(public)”不构成 URL 的一部分,它就像使用 meteor 作为普通旧 Web 服务器的文档根)。
  •     meteor create cssSwitcher
    cd cssSwitcher/
    mkdir public
    echo 'html, body { background-color: red; }' > public/one.css
    echo 'html, body { background-color: blue; }' > public/two.css
  • 在 HTML 的头部创建对辅助函数“适当样式表”的引用:

    HTML 模板

  •     <!-- add code to the <body> of the page -->
    <body>
    <h1>Hello!</h1>
    {{> welcomePage}}
    </body>

    <!-- define a template called welcomePage -->
    <template name="welcomePage">
    <!-- add code to the <head> of the page -->
    <head>
    <title>My website!</title>
    <link rel="stylesheet" href="/{{appropriateStylesheet}}" type="text/css" />
    </head>

    <p>Welcome to my website!</p>
    <button id="red">Red</button>
    <button id="blue">Blue</button>
    </template>
  • 创建一个辅助函数。

    JavaScript:

  •     if (Meteor.isClient) {
    Session.set("stylesheet","red.css");

    Template.registerHelper("appropriateStylesheet", function() {
    return Session.get("stylesheet");
    });

    Template.welcomePage.events({
    'click #blue' : function() { Session.set("stylesheet","two.css"); },
    'click #red' : function() { Session.set("stylesheet","one.css"); },
    });

    }

    你可以对 JS 文件做同样的事情。将它们放在/public 下, meteor 会忽略它们。

    关于meteor - 如何在 Meteor 1.0 中有条件地加载/捆绑 CSS 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27263232/

    26 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com