Hello world!
webpack.config.js
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackPartialsPlugin = require('html-webpack-partials-plugin');
module.exports = {
entry: {
main: path.join(__dirname, './main.js')
},
output: {
path: path.join(__dirname, './dist'),
filename: '[name].js'
},
plugins: [
new HtmlWebpackPlugin(),
new HtmlWebpackPartialsPlugin({
path: path.join(__dirname, './partials/head.html'),
priority: 'high',
location: 'head'
}),
new HtmlWebpackPartialsPlugin({
path: path.join(__dirname, './partials/body.html')
})
]
};
main.js
console.log('Test!');
partials/body.html
<h1>Hello world!</h1>
...and the rest of this configuration example
partials/head.html
<style>
h1 {
color: white;
background-color: #5F4B8B;
}
</style>