The explicit dependencies returned by bower.commands.list() may have transitive dependencies in their dependencies attributes. Is it valuable to expose those to requirejs, similar to Bower's flattening of transitive dependencies in the bower_components directory? Or should it be expected that if a developer intends to require something, they should add an explicit entry to bower.json?

Hey,
I get an error while executing the postinstall task:

bower postinstall   bower-requirejs -c app/js/main.js
bower ENOENT        spawn ENOENT

Stack trace:
Error: spawn ENOENT
    at errnoException (child_process.js:988:11)
    at Process.ChildProcess._handle.onexit (child_process.js:779:34)

[...]
System info:

Bower version: 1.3.3
Node version: 0.10.26
OS: Windows_NT 6.1.7601 x64

I'm using requirejs v 1.3.3

Any ideas?

I'm trying to use both tasks:

• grunt-bower-requirejs
• grunt-bower-task

grunt.loadNpmTasks('grunt-bower-requirejs');
grunt.loadNpmTasks('grunt-bower-task');

One is doing 'bower install' and this one fill my requirejs config file.

AFAIK I can't rename tasks in my Gruntjs file, I can only compose.
Please show me an example if I'm wrong on how to use both;

Looks like RequireJS was updated yesterday and now our tests are failing. Our config files are coming out kind of scrambled.

require.config({{  // extra brace
    shim: {

    },
    paths: {
        hm: 'scripts/vendor/hm',
        esprima: 'scripts/vendor/esprima',
        anima: 'bower_components/anima/anima.min',
        jquery: 'bower_components/jquery/jquery',
        'jquery-ui-touch-punch-amd': 'bower_components/jquery-ui-touch-punch-amd/jquery.ui.touch-punch',
        requirejs: 'bower_components/requirejs/require',
        respond: 'bower_components/respond/respond.src',
        typeahead: 'bower_components/typeahead.js/dist/typeahead',
        highcharts: 'bower_components/highstock/js/highcharts.src',
        highstock: 'bower_components/highstock/js/highstock.src',
        'highcharts-more': 'bower_components/highstock/js/highcharts-more.src'
    }
}; // no closing parenthesis

I haven't had time to look into what's actually causing this but I wanted to document it since I just got bit.

Either RequireJS changed their API and we need to use it differently or a bug was introduced.

cc @jrburke

It looks like requirejs wants to append ".js" to any file (non-directory) listed in the paths. Thus, this task should probably strip any ".js" from the filename. I've done this in a fork and can send a pull request if desired. Might just be user error though.

When I init a yeoman project and user bower to install a component.
After the "grunt bower", I found the path is is wired and unable to link to the corresponding js file.
It seems the path generated by grunt-bower-requirejs start from project root, but not start from the data-main plus baseUrl.

On windows, generated paths have double back slashes as a delimeter.

Example:

requirejs.config({
    baseUrl: './',
    paths: {
        jquery: 'src\\vendor\\jquery\\jquery'
    }
});

#26 added the ability to use a top level js file if it finds one. However, a lot of people include grunt.js and Gruntfile.js files so that screws the task up. It should ignore those as well. I can do a PR for this. Just creating an issue so I don't forget.

Bower will soon have postinstall support which means we no longer need to have this as a grunt plugin. Postinstall means you can put a reference to a binary in bower.json and it will be executed after bower install is run, which would make this much smoother to use.

Though the biggest reason for a rewrite is that the current codebase has a lot of cruft and is getting harder to maintain.

The end result should be a lib with all the logic and a small binary which exposes the lib through the cli. That way it can be used programmatically too.

@robdodson you up for it?

When running bower-requirejs from the command line, there is a chance that git timesout during bower.commands.list. Please add an option to allow bower-requirejs to run offline. It would help tremendously for those with intermittent / no Internet connection. For the time being, this is my solution:

    bower.commands.list({}, {
        offline: true
    })

Let's assume that my project depends on a component that declare more than one main file, like the following:

{
  "name": "componentName",
  "version": "1.0.0",
  "main": [
    "path/to/style.css",
    "path/to/main.js",
    "path/to/template.jade"
  ],
  "dependencies": {
    ...
  },
  "devDependencies": {
    ...
  }
}

The wired mainConfig file will end up to have those files as paths fallbacks like the following:

require.config({
  paths: {
    "componentName": [
      "components/component-name/path/to/style.css",
      "components/component-name/path/to/main.js",
      "components/component-name/path/to/template.jade"
    ]
  }
})

This is a requirejs misconfiguration.
A solution can take care of each main file and create a specific path configuration (maybe using the filename as discriminating factor). See the following example:

require.config({
  paths: {
    "component-name-style": "components/component-name/path/to/style.css",
    "component-name-main":  "components/component-name/path/to/main.js",
    "component-name-template": "components/component-name/path/to/template.jade"
  }
})

In case of name matching (e.g. main.coffe and main.js) it should also include the file extension in the path key.
I'll be happy to work on a pull request for this. Can you please give me some feedbacks?

This task appears to ignore any baseUrl defined in the RequireJS config.

May I ask what is the reason behind excluding requirejs component on line 34?

...
if (excludes.indexOf(key) !== -1 || key === 'requirejs') {
...

In my project I'm bundling main module with requirejs in one file, however because of this exclude I can't use bower's component requirejs as there is no path for it.

Would be good if it were possible to add an indentation value in the Gruntfile.js to keep the config.js file in line with the rest of a project.

bower: {
  rjsConfig: 'scripts/config.js',
  // Use 2 spaces for indentation (default is 4)
  indent: '  '
}

Should be a case of changing line 28 of bower-hooks.js to:

return 'require.config(' + stringifyObject(config, {indent: grunt.config('bower.indent') || '    '});

Happy to submit a pull request if you're interested.

I think it would be a good automation and safe assumption (?) for "main" of component's package.json's to come into play, if bower.json doesn't have a "main" or is missing completelly. For example, knockout has

  "name": "knockout",
  "version": "2.3.0",
  "repository": {
    "type": "git",
    "url": "git://github.com/SteveSanderson/knockout"

but no "main".

jQuery (1.9.1) is even worse, it doesnt have a bower.json. EDIT: jquery does work, through the look for a top level .js file tactic. Is there some reason package.json can't be used as a fall back ?

Also it would be usefull to display which components failed to be associated with a .js

This is the grunt task I'm using:

bower: {
            rjs: {
                rjsConfig: '<%= yeoman.app %>/scripts/config.js'
            }
        }

This is the bower.json:

{
  "name": "private",
  "version": "0.0.2",
  "dependencies": {
    "modernizr": "2.6.2",
    "bootstrap": "2.3.1",
    "backbone": "1.0.0",
    "jquery": "1.8.0",
    "lodash": "1.2.1",
    "underscore.string": "2.3.1",
    "fuelux": "2.3.0",
    "backbone-forms": "0.12.0",
    "layoutmanager": "0.8.7",
    "components-font-awesome": "3.1.0"
  },
  "ignore": [
    ".jshintrc"
  ]
}

This rather is the starting config.js file:

requirejs.config({
    paths: {

    },
    shim: {
        bootstrap: {
            deps: [
                "jquery"
            ],
            exports: "Bootstrap"
        },
        backbone: {
            deps: [
                "lodash",
                "jquery"
            ],
            exports: "Backbone"
        },
        layoutmanager: [
            "backbone"
        ]
    }
});

But, unfortunately, this is the result:

Running "bower:rjs" (bower) task
Fatal error: Arguments to path.join must be strings

Someone else have the same issue?

Can you, please, don't touch code formatting of existing code?

I have a require.js config with large shim section for legacy code (about 50 lines). It looks like:

...
    'jquery.tablesorter': ['jquery'],
    'jquery.tablesorter.pager': ['jquery'],
    'jquery.chosen.min': ['jquery'],
    'jquery.checkbox.min': ['jquery'],
    'jquery.collapsibleCheckboxTree': ['jquery'],
    'jquery.placeholder': ['jquery'],
...

But after paths transformation it become (about 136 lines):

...
    'jquery.tablesorter': [
      'jquery'
    ],
    'jquery.tablesorter.pager': [
      'jquery'
    ],
    'jquery.chosen.min': [
      'jquery'
    ],
    'jquery.checkbox.min': [
      'jquery'
    ],
    'jquery.collapsibleCheckboxTree': [
      'jquery'
    ],
    'jquery.placeholder': [
      'jquery'
    ],
...

So it's really hard to read and very annoying.

i have try but the the shim options is empty
is there any method to auto grenerate it ?

You can configure require.js prior to loading the library by setting a global require variable:

// require-config.js
var require = { paths: {}, shim: {} };

I tried throwing grunt-bower-requirejs at this file but it did nothing. Any thoughts on supporting this feature?

My require path's are always becoming relative to root path of my project.
I rather would like to see the paths as ./js/... or at least directly /.
Couldn't figure it out.

You can see my test configuration:

.bowerrc:

{
    "directory" : "./js/vendor"
}

bower.json:

{
  "name": "Test",
  "main"       : "js/config.js",
  "description": "test",
  "private": true,
  "dependencies": {
    "canjs-nod": "../canjs-nod/",
    "requirejs-text": ">=2.0.10",
    "requirejs": ">=2.1.8"
  }
}

grunt:

yo --version && echo $PATH $NODE_PATH && node -e 'console.log(process.platform, process.versions)' && cat Gruntfile.js

darwin { http_parser: '1.0',
  node: '0.10.17',
  v8: '3.14.5.9',
  ares: '1.9.0-DEV',
  uv: '0.10.14',
  zlib: '1.2.3',
  modules: '11',
  openssl: '1.0.1e' }
/*global module:false*/
module.exports = function(grunt) {
    grunt.initConfig({
        bower: {
            target  : {
                rjsConfig   : './js/config.js',
                baseUrl     : './js/'
            }
        }
    });

    grunt.loadNpmTasks('grunt-bower-requirejs');
    grunt.registerTask('default', ['bower']);
};

result (js/config.js):

'use strict';
var jQuery, $, app;
(function (window, $, jQuery, require, requirejs, app, Object, define) {
    requirejs.config({
            baseUrl: 'js',
            waitSeconds: 0,
            optimize: false,
            urlArgs: 'ts=1377570277150',
            onError: function (error) {
        return console.log(error.message, error.requireModules);
        },
            paths: {
                    'canjs-nod': '../vendor/canjs-nod/nod',
                    jquery: '../vendor/jquery/jquery',
                    'requirejs-text': '../vendor/requirejs-text/text',
                    requirejs: '../vendor/requirejs/require',
                    stacktrace: '../vendor/stacktrace/stacktrace'
            }
    });
}) (window, $, jQuery, require, requirejs, app, Object, define);

@rpflorence mentioned on IRC that it should add the entries as packages not paths. Do you mind expanding on this?

these 2 are also included into the require config

I tried many ways to fix that but i cant find a solution. The module 'stringify-object' is there and its keeps loading the task with the follow error:

Loading "bower-hooks.js" tasks...ERROR

You can try out, just update the Yeoman and create a new 'webapp' and run 'grunt'.

How can i solve this issue and fix this error?

Follow the running command:

grunt bower --verbose

Registering "grunt-bower-hooks" local Npm module tasks.
Reading /Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana_/node_modules/grunt-bower-hooks/package.json...OK
Parsing /Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana_/node_modules/grunt-bower-hooks/package.json...OK
Loading "bower-hooks.js" tasks...ERROR

Error: Cannot find module 'stringify-object'
at Function.Module.resolveFilename (module.js:338:15)
at Function.Module.load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.module.exports (/Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana/node_modules/grunt-bower-hooks/tasks/bower-hooks.js:3:24)
at loadTask (/Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana/node_modules/grunt/lib/grunt/task.js:312:10)
at /Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana_/node_modules/grunt/lib/grunt/task.js:348:7
at Array.forEach (native)
at loadTasks (/Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana_/node_modules/grunt/lib/grunt/task.js:347:11)
at Task.task.loadNpmTasks (/Users/henryoliver/Documents/Polen/Projects/Playlana/Development/playlana_/node_modules/grunt/lib/grunt/task.js:395:5)

Thank you

Consider Yeoman's 1.0 webapp generator. The file lives in /app/scripts/main.js

bower:
            options:
                exclude: ["modernizr"]
            all:
                rjsConfig: "<%= yeoman.app %>/scripts/main.js"

This would modify main.js creating the paths entries but not relative to the location of main.js, as a result the auto generated main.js fails.

In the following code all app/ should be replaced by ../

require.config({
    "paths": {
        "bootstrap": "vendor/bootstrap",
        "jquery": "app/components/jquery/jquery",
        "angular": "app/components/angular/angular",
        "angular-cookies": "app/components/angular-cookies/angular-cookies",
        "angular-mocks": "app/components/angular-mocks/angular-mocks",

I can't seem to figure it out. My other grunt plugins work fine, but this one keeps coming up with:

Warning: Maximum call stack size exceeded Use --force to continue.

Node: 0.8.25
NPM: 1.3
Grunt: 0.4.1
Bower: 0.10.0

Gruntfile.js

module.exports = function (grunt) {
  grunt.initConfig({
    bower: {
      target: {
        rjsConfig: 'config.js'
      }
    }
  })
  grunt.loadNpmTasks('grunt-bower-requirejs')
  grunt.registerTask('default', ['bower'])
}

config.js

requirejs.config({
  baseUrl: './',
  paths: {}
});

bower.json

{
  "name": "Test",
  "version": "0.0.1",
  "dependencies": {
    "requirejs": "2.1.6",
    "marionette": "1.x"
  },
  "ignore": [
    "**/.*",
    "node_modules",
    "components",
    "bower_components",
    "test",
    "tests"
  ]
}

I'm posting this issue to let you know that we will be publishing Grunt 0.4 on Monday, February 18th.

If your plugin is not already Grunt 0.4 compatible, would you please consider updating it? For an overview of what's changed, please see our migration guide.

If you'd like to develop against the final version of Grunt before Monday, please specify "grunt": "0.4.0rc8" as a devDependency in your project. After Monday's release, you'll be able to use "grunt": "~0.4.0" to actually publish your plugin. If you depend on any plugins from the grunt-contrib series, please see our list of release candidates for compatible versions. All of these will be updated to final status when Grunt 0.4 is published.

Also, in an effort to reduce duplication of effort and fragmentation in the developer community, could you review the grunt-contrib series of plugins to see if any of your functionality overlaps significantly with them? Grunt-contrib is community maintained with 40+ contributors—we'd love to discuss any additions you'd like to make.

Finally, we're working on a new task format that doesn't depend on Grunt: it's called node-task. Once this is complete, there will be one more conversion, and then we'll never ask you to upgrade your plugins to support our changes again. Until that happens, thanks for bearing with us!

If you have any questions about how to proceed, please respond here, or join us in #grunt on irc.freenode.net.

Thanks, we really appreciate your work!

Since I'm not really using RequireJS anymore these days I haven't been able to devote much attention to this project. I would really love to find a new maintainer to take over responsibility for bower-requirejs and grunt-bower-requirejs. I'm more than happy to stay on and review issues and discuss things, I just won't have time to write new code.

Anyone up for the challenge?

I have my requirejs configuration file written in coffeescript, which unfortunately makes grunt-bower-requirejs not work. Any chance this use case can be supported?

I am open to doing a PR if this is within scope of what you want for this plugin.

I see from the docs that this plugin modifies the current requirejs.config (if present) and tries to be non-destructive about how it does that. This means, amongst other things, that if you remove a package from bower, it won't be removed from the config.

Can I suggest a different approach: modify a separate config that the user then overrides.

var autoConfig = {
  paths: {
    // This always maps directly to whatever
    // components are installed via bower.
  }
}

require.config(extend(autoConfig, {
  // My rules go here.
}));

This ways it's obvious what grunt is in control of and what I the developer am in control of.

Fe. if I have a long list of shims...

require.config({
    paths: {},
    shim: {
        module1: { deps: ["jquery"], exports: "$.fn.popover" },
        module2: { deps: ["jquery"], exports: "$.fn.popover" },
        module3: { deps: ["jquery"], exports: "$.fn.popover" },
        ...
    }

When I run bower-requirejs, this will be munged into...

require.config({
    paths: {},
    shim: {
        module1: {
            deps: [
                "jquery"
            ],
            exports: "$.fn.popover"
        },
        module2: {
            deps: [
                "jquery"
            ],
            exports: "$.fn.popover"
        },
        module3: {
            deps: [
                "jquery"
            ],
            exports: "$.fn.popover"
        },
        ...
    }

...which in this case then doesn't match the defined code style.

It would be awesome if previously shimmed modules are preset, to respect the formatting they might have.

I mean it doesn't even add shims so why reformat it to some arbitrary format?

Really quick question at the moment I'm only getting the path to the folder downloaded from bower. Is there a way to get the full path including the js filename to be used?

The module has a peerDependency on Bower 0.x which prevents installing 1.0. We should check if the rewrite still offers the same API the module uses to get a list of all components.

Reported by @izifortune via Twitter.

When a package is recognized as a node-style package (dep.pgkMeta.moduleType == 'node'), it will be added to the require.js packages list. However, when running bower-requirejs is run again, the packages list is appended to, rather than the existing package being modified.

E.g:

packages: [
        {
            name: "knockoutjs",
            main: "dist/knockout.js",
            location: "etc\\bower_components\\knockoutjs"
        },
        {
            name: "knockoutjs",
            main: "dist/knockout.js",
            location: "etc\\bower_components\\knockoutjs"
        }
    ]

npm info grunt-bower-requirejs says that https://github.com/yeoman/grunt-bower-hooks is the homepage, but it doesn't seem to exist.

Perhaps it should point to https://github.com/yeoman/grunt-bower-requirejs?

Plugin writes the config this way:

require.config({
  "paths": {
    "jquery": "app/components/jquery/jquery",
    "sugar": "app/components/sugar/release/1.3.8/sugar-1.3.8.min"
  }
});

And it breaks default Yeoman .jshintrc config that enforces single quotes. I want to keep using the quotmark: single JSHint config, but it's a pain to change everything each time.

This task makes quick work of updating paths, but what about configuring shims based on bower dependencies? For example, the bower.json for jquery-ui lists jquery as a dependency, but jquery ui doesn't require('jquery') anywhere, much like the vast majority of jquery plugins. It would be really convenient if shims could be setup like so:

requirejs.config({
    ...
    shim: {
        'jquery-ui': ['jquery']
    }
});

The simple solution would be to always create shims for any bower package with dependencies that is not already shimmed. A more advanced solution would involve scanning an AST to see if the module ever requires it's dependencies, indicating that a shim isn't needed.

Seems like it would be smart to make this optional based on a task config flag.

Hi Guys i'm try to use angular-masonry, but the dependencies is drive me crazy,

like this:

'get-size': {
  deps: ['get-style-property']
},
'doc-ready': {
  deps: ['eventie']
},
'item': {
  deps: [
    'doc-ready',
    'eventEmitter',
    'eventie',
    'get-size',
    'get-style-property',
    'jquery-bridget',
    'matches-selector',
  ]
},
'outlayer': {
  deps: [
    'item'
  ]
},
'masonry': {
  deps: [
    'get-size',
    'outlayer'
  ]
},
'angular-masonry': {
  deps: [
    'jquery',
    'angular',
    'imagesloaded',
    'masonry'
  ]
},

and still not working... some gotcha to resolve this?

The programmatic API needs to be documented.

love, your friend Dan

There is modules that need/should to be declared in the 'packages' config instead of the 'paths'.
Please take a look at https://github.com/IndigoUnited/dejavu#taking-it-to-another-level for a typical use case.

An option could be added to provide this kind of "overriding".

$ bower install requirejs
$ grunt bower

Executing these commands adds requirejs: "vendor/requirejs/require" to paths variable. I believe it should not be happening like this.

I try to use "-b" options in console for specify baseUrl parameter, and I check, that program not consider it. I guess, that it happens because register mistake is in program. In bower-requirejs.js this options is declared as "baseurl", but in index.js as "opts.baseUrl".

The peer dependency to bower seems to trigger it, even though bower is already installed globally as recommended.

npm WARN prefer global [email protected] should be installed with -g

Hi - I understand I can exclude specific modules. I can't seem to work out how to exclude all devDependencies. Is this possible?

I've now wired grunt-bower-requirejs into my gruntfile so that a single command (grunt bi:component-name) will install a new component and wire it up in requirejs config. I'm thinking I should do the uninstall equivalent (grunt bu:component-name) since we're not supposed to delete from the bower_components directory.

Any chance grunt-bower-requirejs will support a 'reverse' mode, removing a specific module from the requirejs config? Happy to do a PR.

cheers

The Yeoman.io getting started pages refers to using grunt-bower-requirejs which is why I'm here.

If I run yo webapp it installs sass-bootstrap.

How do I get grunt-bower-requirejs to pickup my sass-bootstrap components?

For dependencies that do not have a bowser.json in its directory, if there is only one .js file at the top of the directory, consider using that as the paths target. It seems like a reasonable assumption for a main value if there is only one .js file at the top level of the dependencies directories.

My requirejs config looks as such:

requirejs.config({
    urlArgs: 'v=' + (new Date().getTime())
});

However, when I run bower-requirejs I end up with a config that has an evaluated urlArgs option. I haven't looked deep in the source (I assume stringify is being used somewhere) but I did notice that there was a comment to perhaps change writeConfig to mergeConfig. Anyone have thoughts on how this may be accomplished?

It'd be nice if you could merge with the Grunt-bower-task plugin and share functionnality. (cc @yatskevich)

Continuing from bower/bower#291

I would like the following to be generated in the main.js file:

require.config({
  paths: {
    underscore: '../components/lodash/lodash'
  }
});

Or something like it, rather than:

require.config({
  paths: {
    lodash: '../components/lodash/lodash'
  }
});

Any ideas on how to go about doing that?