loading npm module with grunt + angular + bower

Question

I am using angular with bower and grunt and I want to load npm modules. I am then using require('my module which is in node_modules') in my main.js but it does not work.

I have tried to download requirejs for bower but still no chance to do it.

The problem is that to load a bower module, it is easy just have to load it in my index.html and find the rightpath such as < /.../.../.../mymodule.js

However this is not the case when using npm as there is not a specific js file in the module.

Thank you for your help.

Answer 1

May be this can help:

To make Require and Import work in the AngularJS framework, use browserify or webpack that bundles your all the javascript files containing require/import into one to resolve the dependencies so that browser can understand require/import syntax, which is otherwise not understood by browsers.

USING BROWSERIFY

For using browserify when using grunt (app.js is the file containing require, you can specify other files in the array),

browserify: {
        options: {
            browserifyOptions: {
                debug: true,
                insertGlobalVars: []
            },
            transform: ['brfs' ]
        },
        app: {
            files: {
                ['app.js']
            }
        }
}

node_modules dependencies required to use browserify are: brfs, grunt-browserify