├── .gitignore ├── README.md ├── lib ├── bower-loader.js ├── bower-plugin-logger.js ├── bower-plugin-main-resolver.js ├── bower-plugin-manifest-resolver.js ├── bower-plugin-utils.js └── bower-plugin.js ├── package.json └── test ├── custom-file.js ├── custom-module-directories.js ├── exclusions.js ├── fixtures ├── bower_components │ ├── fixture-fonts.woff │ ├── module-custom-bower-file │ │ ├── custom.json │ │ ├── module0.css │ │ └── module0.js │ ├── module-custom-file-fallback │ │ ├── bower.json │ │ ├── custom.json │ │ ├── module0.css │ │ └── module0.js │ ├── module-missing-bower │ │ └── module0.js │ ├── module-missing-referenced-file │ │ └── bower.json │ ├── module-multiple-js │ │ ├── bower.json │ │ ├── module0.js │ │ └── module1.js │ ├── module-multiple-mixed-with-subdirs │ │ ├── bower.json │ │ ├── css │ │ │ └── module0.css │ │ ├── fonts │ │ │ └── fixture-fonts.woff │ │ └── js │ │ │ └── module0.js │ ├── module-multiple-mixed │ │ ├── bower.json │ │ ├── module0.css │ │ └── module0.js │ ├── module-provided-a │ │ ├── bower.json │ │ └── module0.js │ ├── module-provided-b │ │ ├── bower.json │ │ └── module0.js │ ├── module-single-array │ │ ├── bower.json │ │ └── module0.js │ ├── module-single-string-css │ │ ├── bower.json │ │ └── module0.css │ ├── module-single-string │ │ ├── bower.json │ │ └── module0.js │ └── module-with-exclusions │ │ ├── bower.json │ │ ├── module0.js │ │ └── module1.js ├── custom-module-multiple-js.js ├── custom-module-single-string.js ├── custom_components │ ├── custom-module-multiple-js │ │ ├── bower.json │ │ ├── module0.js │ │ └── module1.js │ └── custom-module-single-string │ │ ├── bower.json │ │ ├── custom-module-single-string-bower.js │ │ ├── custom-module-single-string-node.js │ │ └── package.json ├── integration-with-provide.js ├── module-alias.js ├── module-custom-bower-file.js ├── module-custom-file-fallback.js ├── module-missing-bower.js ├── module-missing-referenced-file.js ├── module-missing.js ├── module-multiple-js.js ├── module-multiple-mixed-with-subdirs.js ├── module-multiple-mixed.js ├── module-single-array.js ├── module-single-string-css.js ├── module-single-string.js ├── module-with-exclusions.js └── require-multiple-modules.js ├── inclusions.js ├── missing.js ├── multi-module.js ├── search-resolve-modules-directories.js ├── single-module.js ├── test-utils.js ├── utils.js ├── with-module-alias.js └── with-provide-plugin.js /.gitignore: -------------------------------------------------------------------------------- 1 | .idea/ 2 | *.iml 3 | dist/ 4 | node_modules/ 5 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Bower Webpack Plugin 2 | 3 | Use [Bower](http://bower.io/) with [Webpack](http://webpack.github.io/). 4 | 5 | # Getting started 6 | 7 | Install the plugin: 8 | 9 | ``` 10 | npm install --save-dev bower-webpack-plugin 11 | ``` 12 | 13 | Add the plugin to your Webpack configuration: 14 | 15 | ```javascript 16 | var BowerWebpackPlugin = require("bower-webpack-plugin"); 17 | module.exports = { 18 | module: { 19 | loaders: [ 20 | { 21 | test: /\.css$/, 22 | loader: "style-loader!css-loader" 23 | } 24 | ] 25 | }, 26 | plugins: [new BowerWebpackPlugin()] 27 | }; 28 | ``` 29 | 30 | # Configuration 31 | 32 | The plugin takes options object as its single argument. 33 | 34 | * `modulesDirectories` {`string[]` or `string`} - the array of extra module directories, the plugin will look for bower components in. Unless `searchResolveModulesDirectories` is `false`, the plugin searches also for modules in directories defined at [`resolve.modulesDirectories`](http://webpack.github.io/docs/configuration.html#resolve-modulesdirectories). 35 | 36 | * `manifestFiles` {`string[]` or `string`} - the names of the bower manifest files. The plugin will try them in the order they are mentioned. The first matching will be used. 37 | 38 | * `includes` {`RegExp[]` or `RegExp`} - the plugin will match files contained in a manifest file, and will include only those which match any of the RegExp expressions. 39 | 40 | * `excludes` {`RegExp[]` or `RegExp`} - the plugin will match files contained in a manifest, and will exclude all files, which match any of the expressions. 41 | 42 | * `searchResolveModulesDirectories` {`boolean`} - if `false`, the plugin will not search [`resolve.modulesDirectories`](http://webpack.github.io/docs/configuration.html#resolve-modulesdirectories) for bower components. 43 | 44 | Using the plugin, without specifying the configuration is equivalent to following: 45 | 46 | ```javascript 47 | plugins: [ 48 | new BowerWebpackPlugin({ 49 | modulesDirectories: ["bower_components"], 50 | manifestFiles: "bower.json", 51 | includes: /.*/, 52 | excludes: [], 53 | searchResolveModulesDirectories: true 54 | }) 55 | ] 56 | ``` 57 | 58 | # Usage 59 | 60 | When the plugin is active, you can require bower modules using `require`. 61 | 62 | # Example 63 | 64 | This example shows how to use Twitter bootstrap installed by `bower` in your project. 65 | 66 | Make sure, you have [bower installed](http://bower.io/#install-bower). 67 | Create new project and install bower-webpack-plugin: 68 | 69 | ``` 70 | npm init 71 | npm install --save-dev webpack file-loader style-loader css-loader bower-webpack-plugin 72 | ``` 73 | 74 | Install *bootstrap* bower component: 75 | 76 | ``` 77 | bower install bootstrap 78 | ``` 79 | 80 | Create an `index.html` file: 81 | 82 | ```html 83 | 84 |
85 | 86 | 87 | 88 | 89 | 90 |