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>