Bower install jquery-mobile #7554

ganchenkor · 2014-07-08T16:17:34Z

I have some confusion on this.
In master branch bower.json has

"version": "1.5.0-pre",

when I do fetch

$ bower install jquery-mobile

it downloads 1.4.3 version, so my first question would be
1)How do I download 1.5.0pre version usign bower (I tried to append #1.5.0pre - didn't work)
I have no idea where is it fetching from, because my guess it should trigger from master branch
here is output

$ bower update jquery-mobile
bower cached        git://github.com/jquery/jquery-mobile.git#1.4.3
bower validate      1.4.3 against git://github.com/jquery/jquery-mobile.git#~1.4.3

2)After installing using bower and referencing this way:

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<script type="text/javascript" src="bower_components/jquery/jquery.js"></script>
<script type="text/javascript" src="bower_components/jquery-mobile/js/jquery.mobile.js"></script>
</body>
</html>

And I still get an error about

Uncaught ReferenceError: define is not defined

Because I believe I should go into the folder bower_components/jquery-mobile and do

npm install && grunt

but it also doens't work
grunt gives me an error

Warning: Task "config:fetchHeadHash" not found. Use --force to continue.

I also believe if we use bower for jquery-mobile it should already be built without using npm install && grunt

The text was updated successfully, but these errors were encountered:

ganchenkor · 2014-07-08T16:20:20Z

Here is another one I did from bower_components/jquery-mobile
grunt js --force

Tasks directory "build/tasks" not found.

Running "requirejs:js" (requirejs) task

[Error: Error: Malformed wrap config: Error: ENOENT, no such file or directory '~/Repos/tmp/app/bower_components/jquery-mobile/build/wrap.start'
    at Function.build.createConfig (~/Repos/tmp/app/bower_components/jquery-mobile/node_modules/requirejs/bin/r.js:24988:19)
]

I believe this is due that bower.json ignores build folder where those assets are located for requirejs

jaspermdegroot · 2014-07-10T18:17:46Z

We should add some info about Bower to the readme.

gseguin · 2014-07-10T18:18:01Z

@ganchenkor: The bits we ship on bower are the AMD micro-modules. It is not useable from a script tag. You need an AMD loader to use them. This will allow you to pick and choose yourself the components from jQuery Mobile you want to use in your project and the AMD loader will resolve the dependencies for you.

If you're looking for a custom build usable in a script tag please go to: http://jquerymobile.com/download-builder/

If you're looking at building it yourself you need to clone https://github.com/jquery/jquery-mobile, customize the jquery.mobile.js and use our build system to build your custom version of jQM.

gseguin · 2014-07-10T18:18:10Z

Closed #7554

ganchenkor · 2014-07-10T18:21:03Z

Which means using bower install jquery-mobile is totally useless and I have yo actually clone repo to build it. What is the point of having bower than?

gseguin · 2014-07-10T18:24:05Z

I just explained you how to use jQuery Mobile as a bower component. I'm not sure what's unclear to you but if you do ask respectfully I can give you more details on how to use it.

ganchenkor · 2014-07-10T18:26:25Z

Please, I can't figure out how to make it work using bower. Would really appreciate any of your help

ganchenkor · 2014-07-10T18:27:31Z

What I tried is

bower install jquery-mobile
cd into that folder
npm install && grunt
No luck

ganchenkor · 2014-07-10T18:28:08Z

I do respect any of your work. Jqm is awesome product!

gseguin · 2014-07-10T18:28:56Z

That won't work, the bower component is not meant to be built with our build system. If you want to use our build system, you're welcome to but for that you need to clone the repo.

gseguin · 2014-07-10T18:40:31Z

bower install jquery jquery-mobile
If you choose to use requirejs, then bower install requirejs

Then if for instance you want to use jQM's select widget, your index file should contain something like that:

<script src="./bower_components/requirejs/require.js"></script>
<script>
requirejs.config({
    paths: {
        "jquery": "./bower_components/jquery/jquery",
        "jquery-mobile": "./bower_components/jquery-mobile"
    }
});

require( [ "jquery", "jquery-mobile/widgets/forms/select" ], function( $ ) {
    require( [ "jquery-mobile/init" ], function() {
        // Do something fancy with the jQM select
    }); 
});
</script>

Note: I haven't tested that code but this should help you understand what's required to use jQuery Mobile when importing it with Bower.

ganchenkor · 2014-07-10T18:55:49Z

Thank you so much for explaining that, I'll try and let you know

ivansabik · 2015-02-16T00:00:25Z

Came into the same issue, not being familiar myself with RequireJS. I also thought the bower would let me use JQM similarly to other Bower packages just including it. Maybe not that fancy, but for simplicity I ended up using the custom https://github.com/jobrapido/jquery-mobile-bower

evisong · 2015-06-25T07:10:01Z

@ivansabik that is also exactly what I need. Thank you!

websafe · 2015-06-27T03:07:56Z

@ganchenkor, @ivansabik, @evisong I used Grunt only few times, so maybe my solution is not the best, but it works :-) I'm not convinced to use jquery-mobile-bower, I would rather use the official repo. I'm too stupid to force grunt-contrib-requirejs to create a single jquery-mobile JavaScript file for me (is there somewhere a simple tutorial?), and what @gseguin wrote sounds a bit like magic to me. That's why I came up with the following solution, using grunt-contrib-clean, grunt-git and grunt-run (I removed jquery-mobile from my bower.json.

Here's an example Gruntfile.js:

module.exports = function (grunt) {

    grunt.initConfig({
        clean: {
            jquerymobile: 'bower_components/jquery-mobile'
        },
        gitclone: {
            jquerymobile: {
                options: {
                    repository: 'https://github.com/jquery/jquery-mobile.git',
                    branch: 'master',
                    directory: 'bower_components/jquery-mobile'
                }
            }
        },
        run: {
            options: {
                cwd: "bower_components/jquery-mobile"
            },
            jquerymobile_npm_install: {
                cmd: "npm",
                args: [
                    'install'
                ]
            },
            jquerymobile_grunt: {
                cmd: "grunt"
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-git');
    grunt.loadNpmTasks('grunt-run');

    grunt.registerTask('default', [
        'clean',
        'gitclone',
        'run'
    ]);
};

gseguin self-assigned this Jul 10, 2014

jaspermdegroot added the Docs label Jul 10, 2014

gseguin closed this as completed Jul 10, 2014

gseguin mentioned this issue Dec 1, 2014

Cannot Build from Bower #7863

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Bower install jquery-mobile #7554

Bower install jquery-mobile #7554

ganchenkor commented Jul 8, 2014

ganchenkor commented Jul 8, 2014

jaspermdegroot commented Jul 10, 2014

gseguin commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

gseguin commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ivansabik commented Feb 16, 2015

evisong commented Jun 25, 2015

websafe commented Jun 27, 2015

Bower install jquery-mobile #7554

Bower install jquery-mobile #7554

Comments

ganchenkor commented Jul 8, 2014

ganchenkor commented Jul 8, 2014

jaspermdegroot commented Jul 10, 2014

gseguin commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

gseguin commented Jul 10, 2014

gseguin commented Jul 10, 2014

ganchenkor commented Jul 10, 2014

ivansabik commented Feb 16, 2015

evisong commented Jun 25, 2015

websafe commented Jun 27, 2015