New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
Socket
Book a DemoSign in
Socket

grunt-bower

Package Overview
Dependencies
Maintainers
1
Versions
52
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

grunt-bower

Copy bower installed components to dist folder.

latest
Source
npmnpm
Version
0.21.4
Version published
Maintainers
1
Created
Source

grunt-bower Circle CI NPM DLs NPM D/M

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.

License

Copyright (c) 2012 curist Licensed under the MIT license.

Keywords

gruntplugin

FAQs

Package last updated on 02 Dec 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts