fstanis/index.html

## index.html
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title></title>
  <link rel="stylesheet" href="./style.css">
</head>

<body>
  <img src="./img/icon.png">
  <button id="test">Test</button>

  <!-- this file must be named index.js for the spawn-loader with the current config -->
  <script src="./index.js"></script>
  <!--
  alternative for extra files:
  <script src="${require('spawn-loader!other.js')}"></script>
  make sure interpolate: true is set in the config
  -->
</body>

</html>

## webpack.config.js
const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
  output: {
    filename: 'index.html',
    path: path.resolve(__dirname, 'dist')
  },
  entry: ['./src/index.html'],
  module: {
    rules: [
      {
        test: /\.html$/,
        use: ExtractTextPlugin.extract({
          loader: 'html-loader',
          options: {
            // uncomment this if you want files other than index.js to be entries via ${require(spawn-loader!...)}
            //interpolate: true,
            attrs: [
              'link:href',
              'script:src',
              'img:src'
            ]
          }
        })
      },
      {
        test: /\.css$/,
        use: [
          'file-loader',
          'extract-loader',
          'css-loader'
        ]
      },
      {
        test: /\/index\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'spawn-loader',
          options: {
            name: '[hash].js'
          }
        }
      },
      {
        test: /\.(jpg|png)$/,
        use: 'file-loader'
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin('index.html')
  ]
};
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="./style.css">
	</head>

	<body>
	<img src="./img/icon.png">
	<button id="test">Test</button>

	<!-- this file must be named index.js for the spawn-loader with the current config -->
	<script src="./index.js"></script>
	<!--
	alternative for extra files:
	<script src="${require('spawn-loader!other.js')}"></script>
	make sure interpolate: true is set in the config
	-->
	</body>

	</html>
	const path = require('path');
	const ExtractTextPlugin = require('extract-text-webpack-plugin');

	module.exports = {
	output: {
	filename: 'index.html',
	path: path.resolve(__dirname, 'dist')
	},
	entry: ['./src/index.html'],
	module: {
	rules: [
	{
	test: /\.html$/,
	use: ExtractTextPlugin.extract({
	loader: 'html-loader',
	options: {
	// uncomment this if you want files other than index.js to be entries via ${require(spawn-loader!...)}
	//interpolate: true,
	attrs: [
	'link:href',
	'script:src',
	'img:src'
	]
	}
	})
	},
	{
	test: /\.css$/,
	use: [
	'file-loader',
	'extract-loader',
	'css-loader'
	]
	},
	{
	test: /\/index\.js$/,
	exclude: /(node_modules\|bower_components)/,
	use: {
	loader: 'spawn-loader',
	options: {
	name: '[hash].js'
	}
	}
	},
	{
	test: /\.(jpg\|png)$/,
	use: 'file-loader'
	}
	]
	},
	plugins: [
	new ExtractTextPlugin('index.html')
	]
	};