React cache issue in new build

athul dominic — Mon, 24 Jul 2023 05:52:47 +0000

When a new build is deployed, some of the older code is updating due to cache (or some other unknown) issue. i have configured the webpack.config.js file as below by referring the internet.

const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "[name].[contenthash].js",
    publicPath: "/",
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: "babel-loader",
      },
      {
        test: /\.css$/,
        use: [MiniCssExtractPlugin.loader, "css-loader"],
      },
      // Add any additional loaders for other file types
    ],
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "[name].[contenthash].css",
    }),
    // Add any other plugins you need
  ],
  // Add any necessary optimizations or other configuration options
};

index.html

 <!-- adding for cache issues -->
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />

Kindly help with any correction to the above code, or any new other alternative solutions.
This is a urgent requirement

DEV Community: athul dominic

React cache issue in new build