curist / grunt-bower Goto Github PK

I'm trying to use grunt-bower to copy the .less files from Bootstrap so that I can compile them along with my own .less files into a single .css file.

The example below works, but I don't want to have to list all of them. It would be good if the files field supported wildcards: "less/*.less" (these are not included in the "main" section of bootstrap's bower.json file).

Also, is it (could it be) possible to avoid copying a specific file type, eg: css_dest: false?

    bower: {
        dev: {
            dest: 'static',
            js_dest: 'js',
            css_dest: 'css',
            options: {
                packageSpecific: {
                    bootstrap: {
                        files: [
                            "less/alerts.less"
                        ],
                        dest: 'static/fonts',
                        css_dest: 'delete-me',
                        less_dest: 'less/common/bootstrap'
                    }
                }
            }
        }
    },

It seems like jquery-validation (and maybe some others?) doesn't get copied although all the others do.
This is my grunt task:

bower: {
            common: {
                dest: "wwwroot/",
                js_dest: "wwwroot/js",
                css_dest: "wwwroot/css",
                options: {
                    keepExpandedHierarchy: false
                }
            }
        }

Also, I don't why, the file jquery-validation/test/test.js gets copied to my js_dest, but it's the only one.

hey i am using grunt-bower to copy my bower packages in a new folder, when i tried using bootstrap i stumbled on to a problem: it is copying the files but not only the source files but the complete path

I get public/js/bower_components/dist/js/bootstrap.js instead of public/js/bootstrap.js

other packages work like intended

When adding these to the config:

options: {
                packageSpecific: {
                    bootstrap: {
                        files: [
                            "./dist/js/bootstrap.js",
                            "./dist/css/bootstrap.css",
                            "./dist/fonts/glyphicons-halflings-regular.eot",
                            "./dist/fonts/glyphicons-halflings-regular.svg",
                            "./dist/fonts/glyphicons-halflings-regular.ttf",
                            "./dist/fonts/glyphicons-halflings-regular.woff"
                        ],
                        dest: '.tmp/public/fonts',
                        css_dest: '.tmp/public/css/bootstrap'
                    }
                }

Everything get compied where it should but it copies a extra copy like before

The Readme says to install using npm install grunt-bower and when I do I get this not so happy result:

npm ERR! Error: ENOENT, chmod '<MYAPP>/node_modules/grunt-bower/bin/grunt-bower'

Am I supposed to be installing this globally? If so, the Readme doesn't agree.

Any idea why the 0.15.1 update would cause the bower_components to not be copied correctly to the dest folder? I can revert back to 0.15.0 and it works fine.

I am running a Sails app on Openshift. grunt-bower uses ~/.local to save bower data, however, on some platforms like openshift the home directory is not writable. Is there a way to override the .local directory when setting up grunt-bower?

I have tried renaming the HOME directory before running the app, and overriding the following env variables with writable directories, however, grunt-bower seems to be ignoring these and still keeps using ~/.local and therefor sails deployment fails.
XDG_DATA_HOME XDG_CONFIG_HOME

bower now accepts a .bowerrc file to configure the directory that packages get installed in.

Sholud the dev dependencies really be copied to the dist folder?
I think that this at least should be configurable and that the default value should be false. Or is there a reason for copying the dev dependencies to the dist folder?

When I install the Bootstrap.js with Bower and after I call grunt-bower to copy the libraries into the 'targetDir', all the imported .less files by the bootstrap.less (ex.:carousel.less,forms.less,etc...) are ignored and not copied and that's why the bootstrap.less file is unusable :(

Components without the main property is failing to be copied.

An example of this kind of component is normalize-css: https://github.com/necolas/normalize.css/blob/master/component.json

Running bower list --map (I'm using v0.8.5) yields:

$ bower list --map
{
  "jquery": {
    "source": {
      "main": "components/jquery/jquery.js"
    }
  },
  "normalize-css": {
    "source": {
      "styles": "components/normalize-css/normalize.css"
    }
  }
}

I suggest just using the paths option instead (bower list --paths or bower.commands.list({ paths: true})) as it outputs a normalized list of files, combining the main, styles, etc. properties:

$ bower list --paths
{
  "jquery": "components/jquery/jquery.js",
  "normalize-css": "components/normalize-css/normalize.css"
}

NOTE: Not sure what to make of the styles property since it seems to be undocumented (even the final spec for the main property is still up in the air as the issue is still open)

I accidentally forgot to install a bower component that I had defined in packageSpecific options, for some reason this caused grunt-bower to fail silently, not copying over any of the packageSpecific bower dependencies. All other dependencies copied over ok.

The bower.json for handlebars specifies:

"main": [
"handlebars.js",
"handlebars.runtime.js"
],

grunt bower only copies handlebars.js over and not the second item in the list.

$ npm install grunt-bower --save-dev
npm http GET https://registry.npmjs.org/grunt-bower/-/grunt-bower-0.8.0.tgz
npm http 200 https://registry.npmjs.org/grunt-bower/-/grunt-bower-0.8.0.tgz
npm ERR! Error: shasum check failed for /var/folders/5r/y__fb9c54958r6t2h9xx22w40000gn/T/npm-2863-CRfPwf3J/1391955437206-0.3668630688916892/tmp.tgz

"grunt-bower": "curist/grunt-bower", is temp. solution )

It crashed on Windows when meeting path like:

{ [Error: Unable to create directory "D:\Workspace\web-lyk-test\static\js\D:" (Error code: ENOENT).]
origError:
{ [Error: ENOENT, no such file or directory 'D:\Workspace\web-lyk-test\static\js\D:']
 errno: 34,
 code: 'ENOENT',
 path: 'D:\\Workspace\\web-lyk-test\\static\\js\\D:',
 syscall: 'mkdir' } }

Using grunt 0.4.0a and set up my Gruntfile.js with

bower: {
  dev: {
    dest: 'dist/components'
  }
},

Then heading over to terminal and running

grunt bower

and getting the following output error

Loading "bower.js" tasks...ERROR
>> TypeError: Cannot read property '_' of undefined
Warning: Cannot read property 'message' of undefined Use --force to continue.

Aborted due to warnings.

package.json looks like this

{
  "name": "bolt",
  "description": "Bolt starter theme for development",
  "version": "1.0.0",
  "author": "test",
  "homepage": "http://test.com/bolt",
  "repository": {
    "type": "git",
    "url": "https://github.com/test/bolt.git"
  },
  "bugs": {
    "url": "https://github.com/test/bolt/issues"
  },
  "licenses": [
    {
      "type": "MIT",
      "url": "https://github.com/test/bolt/blob/master/LICENSE"
    }
  ],
  "dependencies": {},
  "devDependencies": {
    "clean-css": "~0.4.1",
    "grunt": "~0.4.0a",
    "rimraf": "~2.0.x",
    "grunt-compass": "~0.3.7",
    "grunt-css": "~0.5.1",
    "grunt-contrib-copy": "~0.3.2",
    "grunt-bower": "~0.4.2"
  }
}

Obviously also included

grunt.loadNpmTasks('grunt-bower');

Any ideas? I got nothing.

It got an error with deprecated version of graceful-fs module.

During the installation:

$ npm install grunt-bower --save-dev
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0.
[email protected] /Users/edpittol/Sites/grunt-bower-test
└── [email protected] 

When I execute the grunt

$ grunt -vvv
Initializing
Command-line options: --verbose

Reading "Gruntfile.js" Gruntfile...OK

Registering Gruntfile tasks.

Registering "grunt-bower" local Npm module tasks.
Reading /Users/edpittol/Sites/grunt-bower-test/node_modules/grunt-bower/package.json...OK
Parsing /Users/edpittol/Sites/grunt-bower-test/node_modules/grunt-bower/package.json...OK
(node:10930) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
(node:10930) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
Loading "bower.js" tasks...OK
+ bower

My package.json

{
  "name": "grunt-bower-test",
  "description": "Grunt Bower Test",
  "version": "0.1.0",
  "license": "GPL-2.0",
  "private": true,
  "devDependencies": {
    "grunt": "^1.0.1",
    "grunt-bower": "^0.21.2"
  }
}

~ bower install history.js
~ grunt bower
Fail to copy lib file for history.js!

Yes. Bower packages suck sometimes and they aren't pulled in as magically as I would want them to be, that's why I concatenate all my packages manually anyway, but grunt-bower helps with a lot of packages. However, for packages that do fail this badly, I would like to be able to mute them, so - an "ignore" property would be really nice.

From what I've read there's no way to do this. It would be great though...

My use case, I'm using one gruntfile to manage two parallel development apps (web and mobile) because some tasks are integrated, but then I build them in an outer scope and thus need to copy dependencies as well. I have two separate bower.json and .bowerrc (2 files x 2 apps). It would be great if grunt-bower task could choose the the .bowerrc / bower.json to read from, similar to what wiredep does.

gruntfile.js
app1/
----/bower.json
----/.bowerrc
app2/
----/bower.json
----/.bowerrc

This way in gruntfile I could use grunt-bower to manage each app. For now bower needs to be in the same space as gruntfile.

I'm using bower to install jquery (2.1.0) and (e.g.) bootstrap, and then grunt bower with

build: {
    dest: 'build/bower_components',
    options: {
      expand: true
    }
  }

to install those components in build/bower_components. It works as expected for bootstrap, copying bower_components/bootstrap/{less,dist/css,dist/js}/* to build/bower_components/bootstrap/{less,dist/css,dist/js}/*, but it fails for jquery, copying bower_components/jquery/dist/jquery.js to build/bower_components/jquery/jquery.js, which in turn leads to problems when using grunt-wiredep (which expects jquery.js in dist/).

I tracked down the issue to tasks/bower.json:126, where there is an if-statement that treats those libs special, that only have one entry in src_path. For this (rare?) case, the subdirectory structure is (accidentally?) dropped. I managed to fix it by eliminating the if block and defaulting the else block (i.e. every lib is handled the same way, regardless of 1 or more src_path entries). As a result, subdirectory structure is preserved also for src_path.length===1.

Sorry, no pull-request, as I didn't run any tests on this, nor know if this would be the intended behavior. But it would be great if you could verify and patch this issue.

Thanks!

PS: I couldn't track down where the task gets it's list of files, and changes in the jquery's bower.json:main variable didn't affect the behavior. Would you mind pointing that out?

When using packageSpecific option, file doesn't get copied to its defined dest because of a bug in defining the dest_file_path in tasks/bower.js

Currently, grunt-bower renames files to the name of the package. For example, ui-bootstrap-tpls.js, which is in the angular-bootstrap package, gets renamed to angular-bootstrap.js.

It's here: https://github.com/curist/grunt-bower/blob/master/tasks/bower.js#L93

I'm generating my script tags based on the main property from the bower.json of each of my dependencies, which references the name of the file; the rename breaks this. It'd be great to have an option to leave the filename as is.

I'm finding that sources with multiple files are failing to copy, while single file sources are fine. This is the output from grunt bower:

Fail to copy lib file for angular-strap!
/home/simon/code/Dropbox/HTML/afmobile/src/bower_components/angular/angular.js copied.
Fail to copy lib file for bootstrap!

I tweaked your code to get the caught error message:
TypeError: Cannot read property 'keepExpandedHierarchy' of undefined

This is the output from bower list --path

{
  "angular-animate": "src/bower_components/angular-animate/angular-animate.js",
  "angular-route": "src/bower_components/angular-route/angular-route.js",
  "angular-sanitize": "src/bower_components/angular-sanitize/angular-sanitize.js",
  "angular-strap": [
    "src/bower_components/angular-strap/dist/angular-strap.min.js",
    "src/bower_components/angular-strap/dist/angular-strap.tpl.min.js"
  ],
  "angular": "src/bower_components/angular/angular.js",
  "bootstrap": [
    "src/bower_components/bootstrap/dist/css/bootstrap.css",
    "src/bower_components/bootstrap/dist/js/bootstrap.js",
    "src/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot",
    "src/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg",
    "src/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf",
    "src/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff"
  ],
  "jquery": "src/bower_components/jquery/dist/jquery.js",
  "underscore": "src/bower_components/underscore/underscore.js"
}

Here is my config

bower: {
            src: {
                dest: 'dist/bower_components',
                options: {
                    expand: false,
                    relative: true
                }
            }
        }

var flatten = package_opt.keepExpandedHierarchy === false || options.keepExpandedHierarchy === false;
fixes it but I don't know enough about Grunt to know what else this might break

This may just be confusion in the readme but:

bower: {
            dev: {
                'dest': 'lib/client/vendor',
                'js_dest': 'lib/client/vendor/js',
                'css_dest': 'lib/client/vendor/css',
                'options': {
                    'packageSpecific':
                    {
                        'bootstrap': {
                            'files': [
                                'dist/css/bootstrap.css'
                            ]
                        },
                        'font-awesome': {
                            'files': [
                                'css/font-awesome.css',
                                'fonts/fontawesome-webfont.eot',
                                'fonts/fontawesome-webfont.svg',
                                'fonts/fontawesome-webfont.ttf',
                                'fonts/fontawesome-webfont.woff'
                            ],
                            'dest': 'static/fonts/'
                        }
                    }
                }
            }
        },

if I remove the "packageSpecific" stuff for bootstrap, my lib/client/vendor/css will remain empty.

If this isn't a bug, please just advise what I'm doing wrong! This is with latest 0.8.X from npm.

See my comment in issue 58

Within a single packageSpecific block, it'd be nice to be able to send resources of a single type to multiple destinations (i.e., fonts_dest, and images_dest are great, but don't encompass all potential use cases) and with differing options (e.g. keepExpandedHierarchy:true for some assets, false for others).

been struggling for a bit trying to make it cop-y over fonts folder from font-awesome

this is the current config:

bower: {
            dev: {
                dest: 'src/client',
                js_dest: 'src/client/js/vendor',
                css_dest: 'src/client/css/vendor',
                fonts_dest: 'src/client/fonts/vendor',
                less_dest: '.ignored',
                scss_dest: '.ignored',
                options: {
                    keepExpandedHierarchy: false
                }
            }
        }

actually tried to copy the files manually using packagespecific option but it did not work either, any idea whats happening?

say, this is my bower folder structure -

    bower_lib/
     ** angularjs/
          *** stuff/
                **** xx.js

if target/ is my dest. directory, xx.js is getting copied over to target/stuff instead of target/
i have expand set to false so I think this is possibly a bug.

Globbing currently maintains directory structure only if use inside one child directory. But I can't figure out how to copy a folder from the package root without flattening the structure...

Given the following bower package structure:

bower_components/

> package1/
>> js/
>>> main.js
>>> locales/
>>>> locale1.js
>>>> locale2.js

> package 2/
>> main.js
>> locales/
>>> locale1.js
>>> locale2.js

And a Gruntfile config of this (coffeescript):

bower:
  libs:
    dest: 'libs'
    options:
      expand: true
      stripAffix: true
      packageSpecific:
        package1:
          files: ['js/**']
        package2:
          files: ['**']

The directory structure ends up like this:

libs/

> package1/
>> main.js
>> locales/
>>> locale1.js
>>> locale2.js

> package 2/
>> main.js
>> locale1.js
>> locale2.js

I've tried different combinations of glob patterns and options, but I can't figure out how to copy a package's root directory structure un-altered...

When I try to use retina.js with grunt-bower I got this response:

Running "bower:dist" (bower) task
Warning: Unable to read "undefined" file (Error code: ENOENT). Use --force to continue.

Aborted due to warnings.

I don't know if this is a bug relating grunt-bower, but if not, grunt-bower should print a more informative message.

I have a use case where one of my targets is only interested in 3 of 15 packages. What I could really do with here is an option that works like the opposite of ignorePackages so that I only have to add 3 packages to the Gruntfile as opposed to 12.

It would be great to have also production and mapping files copied to dest by default. To select the kind(s) of files a dedicated option for specifying globbing patterns could be introduced.

instead of just excepting explicit names of packages to ignore... it would be good to handle these tyipcally with regex so that people can say things like....

ignorePackages: ['jquery.*', 'bootstrap'] etc

It looks like you can specify locations for css and js resources. But what I need to do is move around arbitrary file types (.dust, .properties) from components which contain those. I haven't spent a lot of time proving this is NOT possible but it looks like it's not (yet?) possible to have that level of control with this task?

E.g.

component has a directory structure like:

js/
css/
templates/
  - foo.dust
locales/
  US/
    en/
      - foo.properties

But my project requires that all templates (whether they are from bower or part of the main project) be in a single parent templates directory. So, I have to move around not just css/js but also these other file types.

I hope that's enough information. Please let me know.
Thanks!

I've install grunt-bower and config my Gruntfile.js as below:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('component.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'components/backbone/backbone.js',
        dest: 'js/main.min.js'
      }
    },
    bower: {
      dev: {
        dest: 'dest/path'
      }
    }
  });

  // Load the plugin that provides the "uglify" task.
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-bower');

  // Default task(s).
  grunt.registerTask('default', ['uglify', 'bower']);

};

but when I run grunt, I got Error: Cannot find module 'bower'.
And I checked the package.json of grunt-bower, I noticed the bower is in devDependencies. Can you put it into dependencies?

It would be nice if devDependencies could be ignored, without having to manually specify them in the Gruntfile. I know that this can be done by reading the bower.json and then Using Object.keys on the devDependencies property, but I think it'd be nice if the grunt module could do that.

However the Object.keys approach will not exclude dependencies of the devDependencies, that are exclusively used by the devDependencies.

As far as I can tell grunt-bower copies package files in alphabetical order. Which is sometimes something you might want to actually control. For example I'm trying to use grunt-bower in conjunction with Sails.js automatic asset linking and its almost there except for I have no control over the order that packages are copied to the assets directory.

Could we possibly add a 'sort' parameter to the options property? Or possibly a 'order' parameter to the packageSpecific options?

Thanks!

In our project, we use separate dirs for js, css and fonts from bower, like this

dest: 'assets/lib/',
fonts_dest: 'assets/fonts/lib',
js_dest: 'assets/js/lib',
css_dest: 'assets/styles/lib'

But, after upgrading to grunt-bower 0.21.1, it puts all the files into assets/lib

I'm trying to get this working using a dest folder and it doesn't seems to work.

This is the issue I'm getting:
Writing public\vendor\jquery\C:\Users\stla2\Development\lab\grunt\simple.bower\dist\jquery.js...Fail to copy C:/Users/st
la2/Development/lab/grunt/simple.bower/bower_components/jquery/dist/jquery.js for jquery!

dest folder specified seems to be appended to the full output path.

Also created a small example and having the same issue, this is the source basically
http://plnkr.co/edit/yPg2G6

Running on Windows7
grunt-cli v0.1.13
grunt v0.4.5
grunt-bower v0.16.0

From what I saw the code will only copy js files, but library such as bootstrap can have css too.

I must be doing something wrong, but my file structure is

/app
  grunt.js
  /src
    bower.json
    /bower_components
 /dist
    /bower_components

I was trying to copy some the .min files from src to dist but nothing is happening with this in the grunt.js

    bower: {
        src: {
            dest: 'dist/bower_components',
            options: {
                ignore: ['jquery', 'angular-cookies', 'angular-motion'],
                expand: true
            }
        }
    }

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!

I think it would be nice to have an additional extension that covers image files the same way fonts works.

grunt: 0.0.4rc7
grunt-contrib: 0.4.3

Here's the story. I've overriden the dest folder. Unfortunately, no matter how I change the dest, only /public/scripts/vendor is used as the default.

Here's the Gruntfile in CS (for the sake of brievity):

module.exports = (grunt) ->
  grunt.initConfig
    bower:
      dev:
        dest: 'app/vendors'
      dist:
        dest: 'temp/vendors'
  grunt.loadNpmTasks 'grunt-bower'
  grunt.registerTask 'default', ['bower']

The problem occurs in tasks/bower.js. In registerMultiTask, this.file should take an array instead of a simple value. Here's the translated JS from CS (I've tried to keep compatibility with grunt-0.0.3 series):

27a28
> 
29,30c30
<       var _ref, _ref1, _ref2;
<       var dest = ((_ref = this.file) != null ? (_ref1 = _ref[0]) != null ? _ref1.dest : void 0 : void 0) || ((_ref2 = this.file) != null ? _ref2.dest : void 0) || path.join('public', 'scripts', 'vendor');

---
>     var dest = this.file.dest || path.join('public', 'scripts' ,'vendor');
32a33
> 

If you need further info, do not hesitate.

Maybe I am misunderstanding this task, but it doesn't seem to run bower install before attempting to copy files, which makes it pretty useless. I'm using grunt 0.4.5 and grunt-bower 0.13.4, here is my config:

        bower: {
            vendor: {
                dest: "vendor",
                options: {
                    packageSpecific: {
                        qunit: {
                            files: [
                                "qunit/qunit.css",
                                "qunit/qunit.js"
                            ]
                        }
                    }
                }
            }
        }

When I run grunt bower I get this output:

Running "bower:vendor" (bower) task

Done, without errors.

If I run bower install manually before running this task, it copies files as expected.