CODEWITHSUNDEEP
reactjswebpack
squirrelInTheBarel
squirrelInTheBarel

Reputation: 154

webpack and multiple asset-manifest.json files

I am quite new in this javascript world, so maybe there is some error in my thinking.
I have in one react project more applications, which are build at once. Because of caching issues I would like introduce hashing for javascript files. And therefore I need multiple asset-manifest.json files.
I was thinking the webpack-assets-manifest plugin could do the job. But, after playing with it for a while, I didn't find way how to generate correctly multiple asset-manifest.json files. I cannot find some examples for it.

  1. Is webpack-assets-manifest plugin correct plugin do that job ?
  2. What are other possibilities to fix such issue ?

(I am using webpack 5.x)

Upvotes: 0

Views: 1239

Answers (1)

squirrelInTheBarel
squirrelInTheBarel

Reputation: 154

So nobody wants to answer my question, so I have to do it :) I solved this issue with webpack-assets-manifest plugin. The structure of desired manifest.json file is

{
  "files": {
    "private.js": "private/private-aab89d6bb658b9b19760.js",
    "private/index.html": "private/index.html",
  },
  "entrypoints": [
    "private/private-aab89d6bb658b9b19760.js"
  ]
}

Here is the method (config-overrides.js), which could do that:

function addManifestJsonFile(config, outputJsonFile, customerType) {
  const manifest = new WebpackAssetsManifest({
    output: outputJsonFile,
    customize: ({ key, value }) => {
      if (key.toLowerCase().endsWith('.txt')) return false;
      if (!key.toLowerCase().includes(customerType)) return false;
      return { key, value };
    },
    transform(assets) {
      return {
        files: assets,
        entrypoints: [assets[customerType + '.js']]
      };
    }
  });
  config.plugins.push(manifest);
}

Upvotes: 3

Related Questions