在 MEAN.js 代码库中插入 jQuery 插件的位置答案

【问题标题】：Where to insert jQuery plugins into MEAN.js codebase在 MEAN.js 代码库中插入 jQuery 插件的位置
【发布时间】：2014-10-15 13:56:56
【问题描述】：

我用 MEAN.js 开发了几个静态页面。我试图将 jQuery Lightbox 插件添加到我的项目中。 jQuery Lightbox 插件有 jQuery.lightbox.js 和 jQuery.lightbox.css。

你能告诉我应该把这些文件放在哪里吗？ 我试图放入 /public/dist 文件夹，但服务器无法加载 js 和 css 文件。

【问题讨论】：

您也必须将它们包含在您的 html 中，而不仅仅是在您的文件系统中
看看这个，可能会有帮助：stackoverflow.com/questions/26498540/…

标签： javascript jquery mean-stack

【解决方案1】：

您可能需要查看配置文件夹下的内容。 config 文件夹包含配置应用程序所需的文件。 http://meanjs.org/docs.html#configuration

css、js等资产都在/config/env/all.js中调用

【讨论】：

【解决方案2】：

你需要这样的东西，但你需要重写脚本的 URL，如果这些脚本与你的 html 文件不在同一个目录中。当然，如果您使用的是其他版本的 jQuery，那么也需要重写该文件名。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="jQuery.lightbox.css" type="text/css">
        <script src="jquery-1.11.0.min.js" type="text/javascript"></script>
        <script src=" jQuery.lightbox.js" type="text/javascript"></script>
        <script type="text/javascript" src="MEAN.js"></script>
    </head>
    <body>

    </body>
</html>

请查看：http://www.w3schools.com/html/html_basic.asp

【讨论】：

【解决方案3】：

您必须在客户端路由中添加：modules/“application-module”/client/config/client.routes.js。参考下面的代码。

    .state('dashboards.dashboard_2', {
        url: "/dashboard_2",
        templateUrl: "views/dashboard_2.html",
        data: { pageTitle: 'Dashboard 2' },
        resolve: {
            loadPlugin: function ($ocLazyLoad) {
                return $ocLazyLoad.load([
                    {
                        serie: true,
                        name: 'angular-flot',
                        files: [ 'js/plugins/flot/jquery.flot.js', 'js/plugins/flot/jquery.flot.time.js', 'js/plugins/flot/jquery.flot.tooltip.min.js', 'js/plugins/flot/jquery.flot.spline.js', 'js/plugins/flot/jquery.flot.resize.js', 'js/plugins/flot/jquery.flot.pie.js', 'js/plugins/flot/curvedLines.js', 'js/plugins/flot/angular-flot.js' ]
                    },
                    {
                        serie: true,
                        files: ['js/plugins/jvectormap/jquery-jvectormap-2.0.2.min.js', 'js/plugins/jvectormap/jquery-jvectormap-2.0.2.css']
                    },
                    {
                        serie: true,
                        files: ['js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js']
                    },
                    {
                        name: 'ui.checkbox',
                        files: ['js/bootstrap/angular-bootstrap-checkbox.js']
                    }
                ]);
            }
        }
    })

【讨论】：