What is the best way to share state between Webpack plugins for a compilation lifecycle?

[mjames-c]

I have some state that needs to be shared between Webpack plugins that only needs to persist for a compilation lifecycle. One approach for doing this is to mutate the compilation object. For example:

    class PluginA {
      apply(compiler) {
        compiler.hooks.compilation.tap('PluginA', (compilation) => {
          compilation.pluginAState = { message: 'Hello from Plugin A!' };
        });
      }
    }

    class PluginB {
      apply(compiler) {
        compiler.hooks.compilation.tap('PluginB', (compilation) => {
          if (compilation.pluginAState) {
            console.log(compilation.pluginAState.message); // Output: Hello from Plugin A!
          }
        });
      }
    }

Is this the recommended approach for sharing state? If not what is it?

[xiaoxiaojx]

A common way to share state between Webpack plugins for a compilation lifecycle is to use a WeakMap keyed by the compilation.

const stateMap = new WeakMap();

class PluginA {
  apply(compiler) {
    compiler.hooks.compilation.tap('PluginA', (compilation) => {
      stateMap.set(compilation, { message: 'Hello from Plugin A!' });
    });
  }
}

class PluginB {
  apply(compiler) {
    compiler.hooks.compilation.tap('PluginB', (compilation) => {
      const state = stateMap.get(compilation);
      if (state) {
        console.log(state.message); // Hello from Plugin A!
      }
    });
  }
}

[alexander-akait]

Alternative place you can use records - https://github.com/webpack/webpack/blob/main/types.d.ts#L2328

[mjames-c]

great! thank you for the quick responses!