https://github.com/kaelzhang/assets-html-webpack-plugin
Handle JavaScript or CSS assets to the HTML, woking with html-webpack-plugin
https://github.com/kaelzhang/assets-html-webpack-plugin
assets hash webpack webpack-plugin
Last synced: 2 months ago
JSON representation
Handle JavaScript or CSS assets to the HTML, woking with html-webpack-plugin
- Host: GitHub
- URL: https://github.com/kaelzhang/assets-html-webpack-plugin
- Owner: kaelzhang
- License: other
- Created: 2017-06-20T12:21:36.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2017-08-31T15:23:18.000Z (almost 9 years ago)
- Last Synced: 2026-04-07T21:38:55.059Z (3 months ago)
- Topics: assets, hash, webpack, webpack-plugin
- Language: JavaScript
- Size: 37.1 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: HISTORY.md
- License: LICENSE-MIT
Awesome Lists containing this project
README
[](https://travis-ci.org/kaelzhang/assets-html-webpack-plugin)
# assets-html-webpack-plugin
Handle JavaScript or CSS assets to the HTML, woking with [html-webpack-plugin](https://www.npmjs.com/package/html-webpack-plugin)
- Supports to add vendors to html pages.
- Fallback to global output configuration of webpack.
## Install
```sh
$ npm install assets-html-webpack-plugin --save-dev
```
## Usage
```js
// html-webpack-plugin@^2.10.0 is required
const HtmlPlugin = require('html-webpack-plugin')
const AssetsPlugin = require('assets-html-webpack-plugin')
const webpackConfig = {
output: {
path: '/path/to',
...
},
plugins: [
new HtmlPlugin(...),
new AssetsPlugin({
// Suppose the filepath is '/src/foo.js'
assets: [require.resolve('./path/to/foo')],
chunks: ['vendor'],
output: {
filename: 's/[name].[chunkhash].js',
publicPath: '//mycdn.com/m'
}
})
]
}
```
Then, `/src/foo.js` will be copied to
```
/path/to/s/
|-- foo.26313ef12faa88b00420.js
```
And the following script tags will be injected into the html:
```html
```
Notice that `assets` scripts will come first, then `chunks`.
## new AssetsPlugin(options [, options, ...])
**options** `Object`
- **assets** `Array.`
- **chunks** `Array.`
If both `assets` and `chunks` are empty or not defined, an error will throw.
- **output.filename** `String` default to `webpack.config.output.filename`. Which will not affect `chunks`.
- **output.publicPath** `String` default to `webpack.config.output.publicPath`
- **append** `Boolean=false` whether the assets will be append to the end of the existing assets
- **typeOfAsset** `String.=` Optional. Specify the type of the asset. By default, `AssetPlugin` will detect the extname of the filepath.
## License
MIT