Grunt-bower NPM

grunt-bower

Copy bower installed components to dist folder.

Getting Started

Install this grunt plugin next to your project's Gruntfile.js with: npm install grunt-bower

Then add this line to your project's grunt.js gruntfile:

grunt.loadNpmTasks('grunt-bower');

Documentation

To your Gruntfile.js, add:

bower: {
  dev: {
    dest: 'dest/path'
  }
}

Add stripAffix option if you'd like to have lib names with its file type affix to be stripped, things like /\.js$/, /js$/ or /\.css$/ etc.:

bower: {
  dev: {
    dest: 'dest/path',
    options: {
      stripAffix: true
    }
  }
}

stripAffix could cause name confliction, use with caution! If you were using grunt-bower prior to v0.9.0, stripJsAffix is now an alias to stripAffix option.

If you want to assign different destination folder for other file types:

bower: {
  dev: {
    dest: 'dest/',
    js_dest: 'dest/js',
    css_dest: 'dest/styles'
  }
}

File types without a [file_type]_dest will go to dest folder.

Note: fonts_dest is a special case, svg, eot, ttf, woff, woff2, otf, are all covered by fonts_dest for convenience.

Note: images_dest is another special case, 'jpeg', 'jpg', 'gif', 'png', are all covered by images_dest for convenience.

If you want to have more specific dest options for certain packages:

bower: {
  dev: {
    dest: 'public/',
    css_dest: 'public/styles',
    options: {
      packageSpecific: {
        bootstrap: {
          dest: 'public/fonts',
          css_dest: 'public/css/bootstrap'
        }
      }
    }
  }
}

If grunt-bower not copying the files you want:

bower: {
  dev: {
    dest: 'public/',
    options: {
      packageSpecific: {
        'typeahead.js': {
          files: [
            "dist/typeahead.bundle.js"
          ]
        }
      }
    }
  }
}

You can ignore some packages if you don't want them to be copied:

bower: {
  dev: {
    dest: 'public/',
    options: {
      ignorePackages: ['jquery']
    }
  }
}

If you want the exported files to be organized by package, use expand option. For example, such config will result in the file structure like this:

bower: {
  dev: {
    dest: 'public/vendor/',
    options: {
      expand: true
    }
  }
}

/public
  /vendor
    /package1
      package1_file1.js
      package1_file2.js
      package1.css
    /package2
      package2.js
      package2.css

Or organized by file type in addition:

bower: {
  dev: {
    dest: 'public/',
    js_dest: 'public/js/'
    css_dest: 'public/css/',
    fonts_dest: 'public/fonts/', //covers font types ['svg','eot', 'ttf', 'woff', 'woff2', 'otf']
    images_dest: 'public/images/', //covers image types ['jpeg', 'jpg', 'gif', 'png']
    options: {
      expand: true
    }
  }
}

/public
  /js
    /package1
      package1_file1.js
      package1_file2.js
    /package2
      package2.js
  /css
    /package1
      package1.css
    /package2
      package2.css

For file path expansion (globbing):

bower: {
  dev: {
    options: {
      packageSpecific: {
        'jquery-ui': {
          keepExpandedHierarchy: true,
          stripGlobBase: true,
          files: [
            'ui/minified/jquery-ui.min.js',
            'themes/base/minified/**'
          ]
        }
      }
    }
  }
}

keepExpandedHierarchy default to true (for all dependencies), you have to explicitly set it to false if you want a flattened output structure.
Set stripGlobBase to true if you only want to keep the expanded part in the globbing pattern. If you want flattening for all packages do:

bower: {
  dev: {
    options: {
      keepExpandedHierarchy: false
    }
  }
}

process option

Type: Function(content, srcpath)

This option is passed to grunt.file.copy as an advanced way to control the file contents that are copied.

bower: {
  dev: {
    options: {
      process: function (content, srcpath) {
        return content.replace(/[sad ]/g,"_");
      },
    },
  },
},

Change Logs

Check here.

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using grunt.