Including JQuery Mobile in a Node JS project with Browserify

Question

I\'m writing a Node JS application where I need both jQuery UI and jQuery Mobile. I\'m using Browserify to pack the modules in a single js file.

I have the following

Answer 1

You need to specify the path to jquery-mobile.

In packadge.json

"devDependencies": {
    "gulp": "3.8.7",
    "browserify": "9.0.3",
    "browserify-shim": "3.8.3",
    // [...] many more hidden
    "jquery": "1.11.0",
    "jquery-mobile": "1.4.1"
},
"browser": {
    "jquery-mobile": "./node_modules/jquery-mobile/dist/jquery.mobile.js"
},
"browserify": {
    "transform": [ "browserify-shim" ]
},
"browserify-shim": {
    "jquery": "$",
    "jquery-mobile" : { "exports": "$.mobile", "depends": [ "jquery:$" ] },
    "three": "global:THREE"
}

in you js file:

var $ = require('jquery');
$.mobile = require('jquery-mobile');

You can see more of this here

I am also using gulp. In gulpfile.js:

gulp.task('browserify', ['jshint'], function () {
    return browserify('./src/js/app.js')
    .bundle()
    .pipe(source('myjs.js'))
    .pipe(gulp.dest('./js/'));
});