如何在Meteor应用程序上正确加载样式表和脚本。_Meteor_Meteor Blaze

如何在Meteor应用程序上正确加载样式表和脚本。

meteor

如何在Meteor应用程序上正确加载样式表和脚本。,meteor,meteor-blaze,Meteor,Meteor Blaze,我正在使用Meteor构建一个仪表板，我从中购买了一个设计模板（HTML），但不知道如何将此设计模板正确集成到我的Meteor应用程序中问题相当简单，我在尝试加载设计模板正常运行所需的css文件和js文件列表时遇到问题。我认为文件没有按正确的顺序加载，这会导致错误。例如，一半的jquery插件不工作，这可能是由于插件文件在jquery文件本身之前加载所致。我可以在网络中看到文件正在加载，但例如，$.sortable函数不可用加载样式表和javascript文件以确保它们按正确顺序加载的正确方

我正在使用Meteor构建一个仪表板，我从中购买了一个设计模板（HTML），但不知道如何将此设计模板正确集成到我的Meteor应用程序中

问题相当简单，我在尝试加载设计模板正常运行所需的css文件和js文件列表时遇到问题。我认为文件没有按正确的顺序加载，这会导致错误。例如，一半的jquery插件不工作，这可能是由于插件文件在jquery文件本身之前加载所致。我可以在网络中看到文件正在加载，但例如，$.sortable函数不可用

加载样式表和javascript文件以确保它们按正确顺序加载的正确方法是什么

第一个问题是我不知道把这些文件放在哪里。我的应用程序的逻辑不需要这些文件，所以我不想把它放在目录客户机中。另外，如果我把它们放在客户端Meteor自动加载它们，那么我就无法控制它们加载的顺序

因此，我将所有模板设计依赖项文件放在公用文件夹中，并尝试手动加载这些文件

我已尝试以下方法加载文件：

1。导入client/main.html文件中的所有文件：

<head>
    <meta charset="UTF-8">
    <title>ETL Web-Admin</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
    <meta content="" name="description"/>
    <meta content="" name="author"/>


    <!-- ================== BEGIN BASE CSS STYLE ================== -->
    <link href="/plugins/jquery-ui/themes/base/minified/jquery-ui.min.css" rel="stylesheet"/>
    ...
    <!-- ================== END BASE CSS STYLE ================== -->


    <!-- ================== BEGIN BASE JS ================== -->
    <script src="/plugins/jquery/jquery-1.9.1.min.js"></script>
    ...
    <script src="/plugins/jquery-cookie/jquery.cookie.js"></script>
    <!-- ================== END BASE JS ================== -->

</head>

Meteor.startup(function () {
});



// <!-- ================== BEGIN BASE CSS STYLE ================== -->
    import "../public/plugins/jquery-ui/themes/base/minified/jquery-ui.min.css"
    ...
// <!-- ================== END BASE CSS STYLE ================== -->

// <!-- ================== BEGIN BASE JS ================== -->
    import "../public/plugins/jquery/jquery-1.9.1.min.js"
    ...
//     <!-- ================== END BASE JS ================== -->

在传统HTML格式中，可以按以下方式执行：

<script>
        // when document is ready, do something
        $(document).ready(function () {
            App.init();
            Dashboard.init();
        });
</script>


//文档准备好后，请执行某些操作
$（文档）.ready（函数（）{
App.init（）；
Dashboard.init（）；
});

如何在Meteor中做到这一点？

使用Meteor项目的结构，您可以在客户端>样式表您可以在client>youNameTemplate.js中使用jquery

Template.youNameTemplate.rendered = function () {
    App.init();
    Dashboard.init();
}

使用Scstructure for projects Meteor，您可以在客户端>样式表您可以在client>youNameTemplate.js中使用jquery

Template.youNameTemplate.rendered = function () {
    App.init();
    Dashboard.init();
}

当您完成应用程序开发并上线时，建议在CDN上托管所有资产文件（CSS和图像）；当您完成应用程序开发并上线时，建议在CDN上托管所有资产文件（CSS和图像）