For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt, and this page is available as Markdown at /plugins/javascript-modules-plugin.md.
close
  • English

      • JavascriptModulesPlugin

      Handles the bundling of JavaScript, usually used to access the hooks of the JavascriptModulesPlugin:

      Examples

      rspack.config.mjs
      class MyJsMinimizerPlugin {
  apply(compiler) {
    compiler.hooks.compilation.tap(MyJsMinimizerPlugin.name, (compilation) => {
      // Access the chunkHash hooks of JavascriptModulesPlugin
      const hooks =
        compiler.rspack.javascript.JavascriptModulesPlugin.getCompilationHooks(
          compilation,
        );
      // Since the JS chunk has been optimized and its content has changed, the chunk hash for the JS chunk needs to be updated
      hooks.chunkHash.tap(MyJsMinimizerPlugin.name, (chunk, hash) => {
        hash.update(`minimized by ${MyJsMinimizerPlugin.name}`);
      });
      // Optimize the JS chunk
      compilation.hooks.processAssets.tap(
        MyJsMinimizerPlugin.name,
        (assets) => {
          optimize(assets);
        },
      );
    });
  }
}

export default {
  plugins: [new MyJsMinimizerPlugin()],
};

      Static methods

      getChunkFilenameTemplate

      Added in v2.2.2
      function getChunkFilenameTemplate(
  chunk: Chunk,
  outputOptions: Output,
): Filename | undefined;

      Returns the filename template that is used to render the JavaScript file of the given chunk, resolved in this order:

      1. chunk.filenameTemplate, if the chunk carries its own template (for example a chunk produced by a splitChunks cache group with filename set).
      2. output.filename, if the chunk can be initial.
      3. output.chunkFilename otherwise.
      class MyPlugin {
  apply(compiler) {
    const { JavascriptModulesPlugin } = compiler.rspack.javascript;
    compiler.hooks.compilation.tap('MyPlugin', (compilation) => {
      compilation.hooks.afterSeal.tap('MyPlugin', () => {
        for (const chunk of compilation.chunks) {
          const template = JavascriptModulesPlugin.getChunkFilenameTemplate(
            chunk,
            compilation.outputOptions,
          );
          const filename = compilation.getPath(template, { chunk });
          console.log(filename);
        }
      });
    });
  }
}
      Difference from webpack

      Hot update chunks are not currently supported because they are not yet exposed to the JavaScript side.