Newline Proliferating Maniac

    webpack-manifest-plugin
    TypeScript icon, indicating that this package has built-in type declarations

    4.0.1 • Public • Published
    webpack-manfiest-plugin

    tests cover size libera manifesto

    webpack-manifest-plugin

    A Webpack plugin for generating an asset manifest.

    ❤️ Please consider Sponsoring my work

    Requirements

    webpack-manifest-plugin is an evergreen 🌲 module.

    This module requires an Active LTS Node version (v10.0.0+) and Webpack v4.44.0+.

    Contributing

    This repository leverages pnpm for dependency management.

    To begin, please install pnpm:

    $ npm install pnpm -g

    Install

    Using npm:

    npm install webpack-nano webpack-manifest-plugin --save-dev

    Note: We recommend using webpack-nano, a very tiny, very clean webpack CLI.

    Usage

    Create a webpack.config.js file:

    const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
    const options = { ... };
    
    module.exports = {
    	// an example entry definition
    	entry: [ 'app.js'	],
      ...
      plugins: [
        new WebpackManifestPlugin(options)
      ]
    };

    And run webpack:

    $ npx wp

    With the default options, the example above will create a manifest.json file in the output directory for the build. The manifest file will contain a map of source filenames to the corresponding build output file. e.g.

    {
      "dist/batman.js": "dist/batman.1234567890.js",
      "dist/joker.js": "dist/joker.0987654321.js"
    }

    Options

    basePath

    Type: String
    Default: ''

    Specifies a path prefix for all keys in the manifest. Useful for including your output path in the manifest.

    fileName

    Type: String
    Default: manifest.json

    Specifies the file name to use for the resulting manifest. By default the plugin will emit manifest.json to your output directory. Passing an absolute path to the fileName option will override both the file name and path.

    filter

    Type: Function
    Default: undefined

    Allows filtering the files which make up the manifest. The passed function should match the signature of (file: FileDescriptor) => Boolean. Return true to keep the file, false to remove the file.

    generate

    Type: Function
    Default: undefined

    A custom Function to create the manifest. The passed function should match the signature of (seed: Object, files: FileDescriptor[], entries: string[]) => Object and can return anything as long as it's serialisable by JSON.stringify.

    map

    Type: Function
    Default: undefined

    Allows modifying the files which make up the manifest. The passed function should match the signature of (file: FileDescriptor) => FileDescriptor where an object matching FileDescriptor is returned.

    publicPath

    Type: String
    Default: <webpack-config>.output.publicPath

    A path prefix that will be added to values of the manifest.

    removeKeyHash

    Type: RegExp | Boolean
    Default: /([a-f0-9]{32}\.?)/gi

    If set to a valid RegExp, removes hashes from manifest keys. e.g.

    {
      "index.c5a9bff71fdfed9b6046.html": "index.c5a9bff71fdfed9b6046.html"
    }
    {
      "index.html": "index.c5a9bff71fdfed9b6046.html"
    }

    The default value for this option is a regular expression targeting Webpack's default md5 hash. To target other hashing functions / algorithms, set this option to an appropriate RegExp. To disable replacing the hashes in key names, set this option to false.

    seed

    Type: Object
    Default: {}

    A cache of key/value pairs to used to seed the manifest. This may include a set of custom key/value pairs to include in your manifest, or may be used to combine manifests across compilations in multi-compiler mode. To combine manifests, pass a shared seed object to each compiler's WebpackManifestPlugin instance.

    serialize

    Type: Function(Object) => string
    Default: undefined

    A Function which can be leveraged to serialize the manifest in a different format than json. e.g. yaml.

    sort

    Type: Function
    Default: undefined

    Allows sorting the files which make up the manifest. The passed function should match the signature of (fileA: FileDescriptor, fileB: FileDescriptor) => Number. Return 0 to indicate no change, -1 to indicate the file should be moved to a lower index, and 1 to indicate the file shoud be moved to a higher index.

    useEntryKeys

    Type: Boolean
    Default: false

    If true, the keys specified in the entry property will be used as keys in the manifest. No file extension will be added (unless specified as part of an entry property key).

    useLegacyEmit

    Type: Boolean
    Default: false

    If true, the manifest will be written on the deprecated webpack emit hook to be compatible with not yet updated webpack plugins.

    A lot of webpack plugins are not yet updated to match the new webpack 5 API. This is a problem when other plugins use the deprecated emit hook. The manifest will be written before these other plugins and thus files are missing on the manifest.

    writeToFileEmit

    Type: Boolean
    Default: false

    If true, will emit the manifest to the build directory and in memory for compatibility with webpack-dev-server.

    Manifest File Descriptor

    This plugin utilizes the following object structure to work with files. Many options for this plugin utilize the structure below.

    {
      chunk?: Chunk;
      isAsset: boolean;
      isChunk: boolean;
      isInitial: boolean;
      isModuleAsset: boolean;
      name: string | null;
      path: string;
    }

    chunk

    Type: Chunk

    Only available if isChunk is true

    isInitial

    Type: Boolean

    Is required to run you app. Cannot be true if isChunk is false.

    isModuleAsset

    Type: Boolean

    Is required by a module. Cannot be true if isAsset is false.

    Compiler Hooks

    This plugin supports the following hooks via the getCompilerHooks export; afterEmit, beforeEmit. These hooks can be useful, e.g. changing manifest contents before emitting to disk.

    getCompilerHooks

    Returns: { afterEmit: SyncWaterfallHook, beforeEmit: SyncWaterfallHook }

    Usage

    const { getCompilerHooks } = require('webpack-manifest-plugin');
    
    class BatmanPlugin {
      apply(compiler) {
        const { beforeEmit } = getCompilerHooks(compiler);
    
        beforeEmit.tap('BatmanPlugin', (manifest) => {
          return { ...manifest, name: 'hello' };
        });
      }
    }

    Notes

    • If using this plugin with webpack-clean and webpack-dev-server, please review this issue.

    Attiribution

    Special thanks to Dane Thurber, the original author of this plugin, without whom this plugin would not exist.

    Meta

    CONTRIBUTING

    LICENSE (MIT)

    Keywords

    none

    Install

    npm i webpack-manifest-plugin

    DownloadsWeekly Downloads

    3,060,863

    Version

    4.0.1

    License

    MIT

    Unpacked Size

    36 kB

    Total Files

    12

    Last publish

    Collaborators

    • avatar
    • avatar