CODEWITHSUNDEEP
javascriptjquerymean-stack
ilikedev
ilikedev

Reputation: 90

Where to insert jQuery plugins into MEAN.js codebase

I developed several static pages with MEAN.js. I was trying to add jQuery Lightbox plugin into my project. jQuery Lightbox plugin has jQuery.lightbox.js and jQuery.lightbox.css.

Could you tell me on where I should put these files? I tried to put into /public/dist folder but the server could not load js and css files.

Upvotes: 1

Views: 1920

Answers (3)

Prem Sanil
Prem Sanil

Reputation: 128

You have to added in the client routes:modules/"application-module"/client/config/client.routes.js. refer to the below code.

    .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']
                    }
                ]);
            }
        }
    })

Upvotes: 0

per.eight
per.eight

Reputation: 436

You may want to look under the config folder. The config folder contains the files you need to configure your application. http://meanjs.org/docs.html#configuration

Css, js and other assets are all called in /config/env/all.js

Upvotes: 4

vaso123
vaso123

Reputation: 12391

You need something like this, but you need to rewrite the URLs of the scripts, if those scripts are not in the same directory as your html file. And of course, if you are using other version of jQuery, then need to rewrite that filename too.

<!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>

Please check: http://www.w3schools.com/html/html_basic.asp

Upvotes: 0

Related Questions