title: Webpack dev server watches Twig
body: <p>I'm using Symfony 4 with Symfony Encore to handle assets, and some useful features, such as HMR.</p>
  
  <p>Currently, I can handle Sass files, CSS files, JS, etc, and it works fine with HMR.</p>
  
  <p>Now I would like to be able to make Weback dev server watch *.twig files for changes and trigger a live reload (as hot reload wouldn't be an option for server-side rendered templates).</p>
  
  <p>I've seen things about <code>--watchContentBase</code> and <code>contentBase</code> options, but it doesn't do anything in my case:</p>
  
  <p>WDS CLI :</p>
  
  <pre><code>./node_modules/.bin/encore dev-server --hot --disable-host-check --watchContentBase --contentBase ./templates/ --reload
  </code></pre>
  
  <p>webpack.config.js :</p>
  
  <pre><code>const Encore = require('@symfony/webpack-encore');
  const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  
  Encore
      .setOutputPath('public/build/')
      .setPublicPath('/build')
      .cleanupOutputBeforeBuild()
      .autoProvidejQuery()  
      .addPlugin(new MiniCssExtractPlugin('[name].css'))
      .enableSourceMaps(!Encore.isProduction())
      .addLoader({
          test: /\.(sc|sa|c)ss$/,
          use: ['css-hot-loader'].concat(
              MiniCssExtractPlugin.loader,
              {
                  loader: 'css-loader'
              },
              {
                  loader: 'postcss-loader'
              },
              // {
              //     loader: 'postcss-loader'
              // },
              {
                  loader: 'sass-loader'
              }            
          ),
        },)
        .addLoader({
          test: /\.twig$/,
          loader: 'raw-loader'
        },)
      .enableVersioning(Encore.isProduction())
      .addEntry('autocall-main', './assets/js/index.js')
      // .addStyleEntry('autocall-main', ['./assets/scss/index.scss'])
      .splitEntryChunks()
      .enableSingleRuntimeChunk()
  ;
  const config = Encore.getWebpackConfig();
  
  module.exports = config;
  </code></pre>
  
  <p>My project files / folders follows the classic Symfony 4 structure: <a href="https://github.com/symfony/demo" rel="noreferrer">https://github.com/symfony/demo</a></p>
  
  <p><strong>What do I miss there?</strong></p>