处理Cache Beyong Nginx服务器以及WebPack JS和CSS版本操作

Question

我有一个在ec2上运行的react nodejs应用程序。

我已经为负载平衡设置了3个实例。

我还启用了nginx配置中的缓存。

基本上，所有内容都应在不同版本的app.js旁边缓存。

我想在JS和CSS SRC链接中添加一个版本号（例如http://mywebsite.com/app.js?1.0）

我的问题是，我可以使用WebPack自动化此操作吗？这是要走的路吗？

Answer 1

html-webpack-plugin是您的朋友。

而不是创建index.html文件，允许WebPack为您做。

var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
    entry: "./index.js",
    output: {
        filename: "./dist/app.bundle.[hash].js"
    },
    plugins: [
        new HtmlWebpackPlugin({
            hash: true,
            filename: './dist/index.html'
        })
   ]
}

这将自动将输出脚本添加到index.html中，并为文件生成哈希。