html-webpack-assets
v1.0.2
Published
Plugin to manage injection of chunks into head and body using HtmlWebpackPlugin
Downloads
1
Maintainers
Readme
npm i --save-dev html-webpack-assets
yarn add --dev html-webpack-assets
This is a webpack plugin that manage chunks in head
and body
tags of HTML files using HtmlWebpackPlugin
to serve your webpack
bundles.
If you want inject chunks in the html document using HtmlWebpackPlugin, somethime you need to inject some chunks
in head
or body
, you just need put chunks to entry in webpack.config.js
with key head
or body
.
webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackAssets = require('html-webpack-assets');
module.exports = {
entry: {
head: "./src/head.css", // Add to head tag
body: "./src/body.js" // Add to body tag
},
output: {
path: "./dist",
filename: "[name].bundle.js"
},
plugins: [
new HtmlWebpackPlugin({
template: "./src/index.ejs",
chunks: ["head", "body"]
}),
new HtmlWebpackAssets()
]
}
This will generate a file dist/index.html
containing the following
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<script type="text/javascript" src="head.bundle.js"></script>
</head>
<body>
<script src="body.bundle.js"></script>
</body>
</html>