Fix: make sure .gz files are up to date.

Author: bjones1

webpack.config.js

@@ -8,9 +8,9 @@
 
 const path = require("path");
 
-const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
 const CopyPlugin = require("copy-webpack-plugin");
 const CompressionPlugin = require("compression-webpack-plugin");
+const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
@@ -37,7 +37,7 @@ module.exports = (env, argv) => {
                 },
                 {
                     test: /\.(png|jpe?g|gif|svg|eot|ttf|woff|woff2)$/i,
-                    // For more information, see https://webpack.js.org/guides/asset-modules/.
+                    // For more information, see `Asset Modules <https://webpack.js.org/guides/asset-modules/>`_.
                     type: "asset",
                 },
             ],
@@ -56,24 +56,24 @@ module.exports = (env, argv) => {
         },
         output: {
             path: path.resolve(__dirname, "runestone/dist"),
-            // See https://webpack.js.org/guides/caching/. This provides a hash for dynamic imports as well, avoiding caching out-of-date JS.
-            filename: "[name].bundle.js?v=[contenthash]",
-            // Node 17.0 reports ``Error: error:0308010C:digital envelope routines::unsupported``. Per `SO <https://stackoverflow.com/a/69394785/16038919>`_, this error is produced by using an old, default hash that OpenSSL removed support for. The `webpack docs <https://webpack.js.org/configuration/output/#outputhashfunction>"__ says that ``xxhash64`` is a faster algorithm.
+            // _`Output file naming`: see the `caching guide <https://webpack.js.org/guides/caching/>`_. This provides a hash for dynamic imports as well, avoiding caching out-of-date JS. Putting the hash in a query parameter (such as ``[name].js?v=[contenthash]``) causes the compression plugin to not update zipped files.
+            filename: "[name].[contenthash].bundle.js",
+            // Node 17.0 reports ``Error: error:0308010C:digital envelope routines::unsupported``. Per `SO <https://stackoverflow.com/a/69394785/16038919>`_, this error is produced by using an old, default hash that OpenSSL removed support for. The `webpack docs <https://webpack.js.org/configuration/output/#outputhashfunction>`__ say that ``xxhash64`` is a faster algorithm.
             hashFunction: "xxhash64",
             // Delete everything in the output directory on each build.
             clean: true,
         },
-        // See https://webpack.js.org/guides/code-splitting/#splitchunksplugin.
+        // See the `SplitChunksPlugin docs <https://webpack.js.org/guides/code-splitting/#splitchunksplugin>`_.
         optimization: {
             moduleIds: "deterministic",
             // Collect all the webpack import runtime into a single file, which is named ``runtime.bundle.js``. This must be statically imported by all pages containing Runestone components.
             runtimeChunk: "single",
             splitChunks: {
                 chunks: "all",
             },
-            // CSS for production was copied from https://webpack.js.org/plugins/mini-css-extract-plugin/#minimizing-for-production.
+            // CSS for production was copied from `Minimizing For Production <https://webpack.js.org/plugins/mini-css-extract-plugin/#minimizing-for-production>`_.
             minimizer: [
-                // For webpack@5 you can use the `...` syntax to extend existing minimizers (i.e. `terser-webpack-plugin`), uncomment the next line.
+                // For webpack@5 you can use the ``...`` syntax to extend existing minimizers (i.e. ``terser-webpack-plugin``), uncomment the next line.
                 `...`,
                 new CssMinimizerPlugin(),
             ],
@@ -101,7 +101,8 @@ module.exports = (env, argv) => {
                 ],
             }),
             new MiniCssExtractPlugin({
-                filename: "[name].css?v=[contenthash]",
+                // See `output file naming`_.
+                filename: "[name].[contenthash].css",
                 chunkFilename: "[id].css",
             }),
             // Copied from the `webpack docs <https://webpack.js.org/plugins/compression-webpack-plugin>`_. This creates ``.gz`` versions of all files. The webserver in use needs to be configured to send this instead of the uncompressed versions.