webpack-bundle-output

Webpack Plugin for creating map from source file to chunk

Usage no npm install needed!

<script type="module">
  import webpackBundleOutput from 'https://cdn.skypack.dev/webpack-bundle-output';
</script>

README

BundleOutputPlugin

BundleOutputPlugin is a webpack plugin for producing "inverse source-maps".

This plugin produces a map.json that maps each source file to all the build files it is included in (key source file to build file array).

It was created for this issue to implement translating source files for WordPress plugins+themes.

Installation

npm install --save-dev webpack-bundle-output

Usage

Simply include BundleOutputPlugin in the plugins array of your webpack.config.js:

const BundleOutputPlugin = require('webpack-bundle-output');

module.exports = {
  ...,
  plugins: [new BundleOutputPlugin()],
  ...,
}

Note that webpack strips needed information in production mode, so the maps you actually want to use should be produced in development mode.

Options

The plugin supports two options (new BundleOutputPlugin({ ... })):

cwd (string). The working directory, relative to which the map should be. Influences both source and build path. Default: process.cwd()
output (string). The output name/path of the map file in the build directory. Default: map.json.