title: How to output html files from pug templates with webpack?
body: <p>I'm trying to output individual html files from pug templates in my webpack project. The problem I'm having is in getting <code>pug-loader</code> to render html into the files.</p>
  
  <p>My webpack.config:</p>
  
  <pre><code>const path = require('path');
  const glob = require('glob');
  const webpack = require('webpack');
  
  const src = path.resolve(__dirname, 'src');
  const dist = path.resolve(__dirname, 'dist');
  
  module.exports = {
    context: src,
  
    entry: {
      pug: glob.sync('./**/*.pug', {
        cwd: src
      }),
      index: path.resolve(src, 'index.js')
    },
  
    output: {
      path: dist,
      filename: '[name].js'
    },
  
    module: {
      rules: [
        {
          test: /\.js$/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['es2015'].map(dep =&gt;
                require.resolve(`babel-preset-${dep}`)
              ) // Fix for lerna symlinked deps
            }
          }
        },
        {
          test: /\.pug$/,
          use: [
            {
              loader: 'file-loader',
              options: {
                name: '[path][name].html'
              }
            },
            'extract-loader',
            'html-loader',
            'apply-loader',
            'pug-loader'
          ]
        }
      ]
    }
  };
  </code></pre>
  
  <p>This correctly generates files for each pug template in my project, but the files do not contain html. Rather, each file looks something like:</p>
  
  <pre><code>var req = require("!!&lt;absolute-path-to-project&gt;/node_modules/pug-loader/index.js!&lt;absolute-path-to-pug-file&gt;/index.pug");
  module.exports = (req['default'] || req).apply(req, [])
  </code></pre>
  
  <p>My installed dependency versions:</p>
  
  <pre><code>{
    "apply-loader": "^2.0.0",
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.0",
    "babel-preset-es2015": "^6.24.1",
    "extract-loader": "^0.1.0",
    "file-loader": "^0.11.1",
    "glob": "^7.1.2",
    "html-loader": "^0.4.5",
    "pug-loader": "^2.3.0",
    "webpack": "^3.0.0"
  }
  </code></pre>