每次看到更改我都必須清除緩存並刷新

Question

webpack.config.js :

const path = require('path')
const config = require('config')
const CopyWebpackPlugin = require('copy-webpack-plugin')


module.exports = {
    entry: './public/clientMain.js',
    node: { 
        fs: 'empty' 
    },
    output: {
        filename: 'app-v' + config.VERSION + '.js',
        libraryTarget: 'var',
        library: 'start',
        path: path.resolve(__dirname, './build/js')
    },
    module: {
        loaders: [{
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader'
        }]
    },
    watchOptions: {
        ignored: /node_modules/,
    },   
    plugins: [
        new CopyWebpackPlugin([
          { from: 'public/assets', to: '../assets' }
        ])
    ]
}

在package.json 中：

"scripts": {
   "start": "concurrently \"node ./node_modules/webpack/bin/webpack.js -d --watch\" \"nodemon ./server/serverMain.js \" \"node ./node_modules/http-server/bin/http-server -p 8080\""

},

問題是每次我對其中一個 js 文件進行更改時，我都必須清除瀏覽器中的緩存，然后刷新頁面以查看更改！ （硬重載或ofc Empty Cache和chrome中的硬重載）

我想這不正常嗎？ 那么我該如何解決這個問題？

Answer 1

正確的方法是在輸出文件名中添加一個哈希值。

 output: {
        filename: 'app-v.[hash].' + config.VERSION + '.js',
    },