Горячая перезагрузка на vue-loader работает только со структурными изменениями в шаблоне

Question

Я установил vue + vue-loader + HMR для существующего проекта.

Это работает в основном хорошо, vue компоненты загружаются и отображаются правильно.

Часть перезагрузки горячего модуля настроена и загружается.

Тем не менее, кажется, что обновления не применяются, когда изменение является только текстовым узлом компонента.

Например, если у меня есть такой компонент:

<template lang="html">
  <div>
    <h1>I'm a Component</h1>
  </div>
</template>

<script>
export default {
}
</script>

И я изменяю это на это:

<template lang="html">
  <div>
    <h1>I'm a Component updated</h1>
  </div>
</template>

<script>
export default {
}
</script>

Затем я вижу обновления HMR в консоли браузера.

Но компонент не обновляется, он по-прежнему говорит: "Я - компонент".

Однако, если я немного изменю html-структуру компонента, вот так:

<template lang="html">
  <div>
    <h1>I'm a Component updated</h1>
    <p>do it</p>
  </div>
</template>

<script>
export default {
}
</script>

Затем консоль показывает журнал HMR, но на этот раз обновление компонента.

Поведение постоянно одинаковое, изменение текста = без обновления.

Загрузчик не имеет ничего особенного в его конфигурации.

{
test: /\.vue$/,
loader: 'vue-loader',
options: {
    loaders: {
    }

}

Сервер dev запускается через gulp с этой задачей:

// Start a webpack-dev-server
const hot_webpack_config = cloneDeep(webpack_config)

hot_webpack_config.output.filename = 'frontend.hot.js'
hot_webpack_config.output.publicPath = PUBLIC_DEV_SERVER
hot_webpack_config.entry.unshift("webpack-dev-server/client?"+PUBLIC_DEV_SERVER, "webpack/hot/dev-server");
hot_webpack_config.plugins.push(new webpack.HotModuleReplacementPlugin())

var compiler = webpack(hot_webpack_config)

var WebpackDevServer = require("webpack-dev-server")

new WebpackDevServer(compiler, {
    //noInfo: true,
    hot: true,
    stats: {
      assets: false,
      colors: true,
      version: false,
      timings: false,
      chunks: false,
      chunkModules: false
    },
    inline: true,
    publicPath: hot_webpack_config.output.publicPath,
    headers: { "Access-Control-Allow-Origin": "*" }

}).listen(4000, "localhost", function(err) {
    if(err) throw new gutil.PluginError("webpack-dev-server", err)
    // Server listening
    gutil.log(chalk.blue("Hot server listening at http://0.0.0.0:4000"))

})

Не уверен, где еще искать это исправить. Как уже упоминалось, это работает, но не для обновлений текстовых узлов.

Я посмотрел на шаблон, сгенерированный vue-cliwebpack-simple пример и код несколько похожи (за исключением того, что dev-сервер запускается из командной строки узла, а не создает его вручную), они обновляют текстовый узел, а мой - нет:(

Есть какие-нибудь подсказки?

Обновление: версии соответствующих зависимостей

vue 2.3.4
vue-loader 13.0.0 
vue-template-compiler 2.3.4 
webpack 2.6.1 
webpack-dev-server 2.5.0 

Обновление 2: применение любой модификации к <script> часть компонента вызывает обновление текстовых узлов.

Обновление 3:

// webpack_config.js
/* jshint node: true */
var webpack = require('webpack'),
    path = require('path'),
    package = require('./package.json'),
    gutil = require('gulp-util'),
    chalk = require('chalk');

const PUBLIC_DEV_SERVER = package.config.build.PUBLIC_DEV_SERVER
const ENTRY = package.config.build.ENTRY

var PROD = process.env.NODE_ENV == 'production';

let config = {
    entry: [
        ENTRY
    ],
    output: {
        path: path.join(__dirname, 'resources', 'js'),
        filename: 'frontend.min.js'
    },
    module: {

        rules: [{
                test: /\.vue$/,
                loader: 'vue-loader',
                options: {
                    loaders: {
                    }

                }
            }, {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
                query: {
                    presets: ['es2015', 'stage-0'],
                }
            }
        ]
    },
    resolve: {
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    }

};

if (process.env.NODE_ENV === 'production') {
    gutil.log(chalk.red("Build for production"));
    config.devtool = '#source-map'
    config.entry = [
        ENTRY
    ];
    // http://vue-loader.vuejs.org/en/workflow/production.html
    config.plugins = (config.plugins || []).concat([
        new webpack.DefinePlugin({
          'process.env': {
            NODE_ENV: '"production"'
          }
        }),
        new webpack.optimize.UglifyJsPlugin({
          sourceMap: true,
          compress: {
            warnings: false
          }
        }),
        new webpack.LoaderOptionsPlugin({
          minimize: true
        })
      ])
} else {
    gutil.log(chalk.red("Build for development"));
    config.devtool = '#eval-source-map' //"cheap-module-eval-source-map"
    config.plugins = [
    ]
}

module.exports = config

PUBLIC_DEV_SERVER установлен в "http://localhost:4000/"

ENTRY установлен в "./src/js/frontend.js"

Answer 1

Я пробовал несколько вещей, чтобы исправить это, я думал, что некоторые настройки исправили это, но возврат к предыдущим версиям внезапно тоже начал работать.

В конце я думаю, что решение было просто:

rm -rf node_modules/
npm i

Но я не знаю точно, какая его часть распалась.