Configuration Options

webpack is configured with an options object, usually exported from a webpack.config.js file. Every build validates that object against the options schema (schemas/WebpackOptions.json), so unknown or malformed options fail with a descriptive error. This page is generated from that schema and lists every supported option; named types link to their full definitions in the API documentation.

Set the value of require.amd and define.amd. Or disable AMD support.

export default {
  amd: false,
};

Report the first error as a hard error instead of tolerating it.

export default {
  bail: true,
};

Cache generated modules and chunks to improve performance for multiple incremental builds.

export default {
  cache: { type: "filesystem" },
};

Allows to collect unused memory allocated during deserialization. This requires copying data into smaller buffers and has a performance cost.

export default {
  cache: {
    allowCollectingMemory: true,
  },
};

Dependencies the build depends on (in multiple categories, default categories: 'defaultWebpack').

export default {
  cache: {
    buildDependencies: {},
  },
};

Base directory for the cache (defaults to node_modules/.cache/webpack).

export default {
  cache: {
    cacheDirectory: '...',
  },
};

Locations for the cache (defaults to cacheDirectory / name).

export default {
  cache: {
    cacheLocation: '...',
  },
};

Compression type used for the cache files.

export default {
  cache: {
    compression: "gzip",
  },
};

Algorithm used for generation the hash (see node.js crypto package).

export default {
  cache: {
    hashAlgorithm: '...',
  },
};

Time in ms after which idle period the cache storing should happen.

export default {
  cache: {
    idleTimeout: 0,
  },
};

Time in ms after which idle period the cache storing should happen when larger changes has been detected (cumulative build time > 2 x avg cache store time).

export default {
  cache: {
    idleTimeoutAfterLargeChanges: 0,
  },
};

Time in ms after which idle period the initial cache storing should happen.

export default {
  cache: {
    idleTimeoutForInitialStore: 0,
  },
};

List of paths that are managed by a package manager and contain a version or hash in its path so all files are immutable.

export default {
  cache: {
    immutablePaths: [],
  },
};

List of paths that are managed by a package manager and can be trusted to not be modified otherwise.

export default {
  cache: {
    managedPaths: [],
  },
};

Time for which unused cache entries stay in the filesystem cache at minimum (in milliseconds).

export default {
  cache: {
    maxAge: 0,
  },
};

Number of generations unused cache entries stay in memory cache at minimum (0 = no memory cache used, 1 = may be removed after unused for a single compilation, ..., Infinity: kept forever). Cache entries will be deserialized from disk when removed from memory cache.

export default {
  cache: {
    maxMemoryGenerations: 0,
  },
};

Additionally cache computation of modules that are unchanged and reference only unchanged modules in memory.

export default {
  cache: {
    memoryCacheUnaffected: true,
  },
};

Name for the cache. Different names will lead to different coexisting caches.

export default {
  cache: {
    name: '...',
  },
};

Track and log detailed timing information for individual cache items.

export default {
  cache: {
    profile: true,
  },
};

Enable/disable readonly mode.

export default {
  cache: {
    readonly: true,
  },
};

When to store data to the filesystem. (pack: Store data when compiler is idle in a single file).

export default {
  cache: {
    store: "pack",
  },
};

Filesystem caching.

export default {
  cache: {
    type: "filesystem",
  },
};

Version of the cache data. Different versions won't allow to reuse the cache and override existing content. Update the version when config changed in a way which doesn't allow to reuse cache. This will invalidate the cache.

export default {
  cache: {
    version: '...',
  },
};

The base directory (absolute path!) for resolving the entry option. If output.pathinfo is set, the included pathinfo is shortened to this directory.

export default {
  context: '...',
};

References to other configurations to depend on.

export default {
  dependencies: [],
};

Options for the webpack-dev-server.

export default {
  devServer: false,
};

A developer tool to enhance debugging (false | eval | [inline-|hidden-|eval-][nosources-][cheap-[module-]]source-map).

export default {
  devtool: "eval",
};

Enable and configure the Dotenv plugin to load environment variables from .env files.

export default {
  dotenv: true,
};

The directory from which .env files are loaded. Can be an absolute path, false will disable the .env file loading.

export default {
  dotenv: {
    dir: '...',
  },
};

Only expose environment variables that start with these prefixes. Defaults to 'WEBPACK_'.

export default {
  dotenv: {
    prefix: '...',
  },
};

Template patterns for .env file names. Use [mode] as placeholder for the webpack mode. Defaults to ['.env', '.env.local', '.env.[mode]', '.env.[mode].local'].

export default {
  dotenv: {
    template: [],
  },
};

The entry point(s) of the compilation.

export default {
  entry: '...',
};

Enables/Disables experiments (experimental features with relax SemVer compatibility).

export default {
  experiments: {},
};

Support WebAssembly as asynchronous EcmaScript Module.

export default {
  experiments: {
    asyncWebAssembly: true,
  },
};

Enable backward-compat layer with deprecation warnings for many webpack 4 APIs.

export default {
  experiments: {
    backCompat: true,
  },
};

Build http(s): urls using a lockfile and resource content cache.

export default {
  experiments: {
    buildHttp: { allowedUris: [] },
  },
};

Enable additional in memory caching of modules that are unchanged and reference only unchanged modules.

export default {
  experiments: {
    cacheUnaffected: true,
  },
};

Enable css support.

export default {
  experiments: {
    css: true,
  },
};

Enable experimental tc39 proposal https://github.com/tc39/proposal-defer-import-eval. This allows to defer execution of a module until it's first use.

export default {
  experiments: {
    deferImport: true,
  },
};

Apply defaults of next major version.

export default {
  experiments: {
    futureDefaults: true,
  },
};

Enable experimental HTML support. This flag does not by itself make .html files usable directly as entry points without additional HTML handling.

export default {
  experiments: {
    html: true,
  },
};

Compile entrypoints and import()s only when they are accessed.

export default {
  experiments: {
    lazyCompilation: true,
  },
};

Allow output javascript files as module source type.

export default {
  experiments: {
    outputModule: true,
  },
};

Enable experimental tc39 proposal https://github.com/tc39/proposal-source-phase-imports. This allows importing modules at source phase.

export default {
  experiments: {
    sourceImport: true,
  },
};

Support WebAssembly as synchronous EcmaScript Module (outdated).

export default {
  experiments: {
    syncWebAssembly: true,
  },
};

Enable typescript support.

export default {
  experiments: {
    typescript: true,
  },
};

Extend configuration from another configuration (only works when using webpack-cli).

export default {
  extends: '...',
};

Specify dependencies that shouldn't be resolved by webpack, but should become dependencies of the resulting bundle. The kind of the dependency depends on output.libraryTarget.

export default {
  externals: '...',
};

Specify externals depending on the layer.

export default {
  externals: {
    byLayer: {},
  },
};

Enable presets of externals for specific targets.

export default {
  externalsPresets: {},
};

Treat common electron built-in modules in main and preload context like 'electron', 'ipc' or 'shell' as external and load them via require() when used.

export default {
  externalsPresets: {
    electron: true,
  },
};

Treat electron built-in modules in the main context like 'app', 'ipc-main' or 'shell' as external and load them via require() when used.

export default {
  externalsPresets: {
    electronMain: true,
  },
};

Treat electron built-in modules in the preload context like 'web-frame', 'ipc-renderer' or 'shell' as external and load them via require() when used.

export default {
  externalsPresets: {
    electronPreload: true,
  },
};

Treat electron built-in modules in the renderer context like 'web-frame', 'ipc-renderer' or 'shell' as external and load them via require() when used.

export default {
  externalsPresets: {
    electronRenderer: true,
  },
};

Treat node.js built-in modules like fs, path or vm as external and load them via require() when used.

export default {
  externalsPresets: {
    node: true,
  },
};

Treat NW.js legacy nw.gui module as external and load it via require() when used.

export default {
  externalsPresets: {
    nwjs: true,
  },
};

Treat references to 'http(s)://...' and 'std:...' as external and load them via import when used (Note that this changes execution order as externals are executed before any other code in the chunk).

export default {
  externalsPresets: {
    web: true,
  },
};

Treat references to 'http(s)://...' and 'std:...' as external and load them via async import() when used (Note that this external type is an async module, which has various effects on the execution).

export default {
  externalsPresets: {
    webAsync: true,
  },
};

Specifies the default type of externals ('amd*', 'umd*', 'system' and 'jsonp' depend on output.libraryTarget set to the same value).

export default {
  externalsType: "var",
};

Ignore specific warnings.

export default {
  ignoreWarnings: [],
};

Options for infrastructure level logging.

export default {
  infrastructureLogging: {},
};

Only appends lines to the output. Avoids updating existing output e. g. for status messages. This option is only used when no custom console is provided.

export default {
  infrastructureLogging: {
    appendOnly: true,
  },
};

Enables/Disables colorful output. This option is only used when no custom console is provided.

export default {
  infrastructureLogging: {
    colors: true,
  },
};

Custom console used for logging.

export default {
  infrastructureLogging: {
    console: undefined,
  },
};

Enable debug logging for specific loggers.

export default {
  infrastructureLogging: {
    debug: '...',
  },
};

Log level.

export default {
  infrastructureLogging: {
    level: "none",
  },
};

Stream used for logging output. Defaults to process.stderr. This option is only used when no custom console is provided.

export default {
  infrastructureLogging: {
    stream: undefined,
  },
};

Custom values available in the loader context.

export default {
  loader: {},
};

Enable production optimizations or development hints.

export default {
  mode: "development",
};

Options affecting the normal modules (NormalModuleFactory).

export default {
  module: {},
};

An array of rules applied by default for modules.

export default {
  module: {
    defaultRules: [],
  },
};

Enable warnings for full dynamic dependencies.

export default {
  module: {
    exprContextCritical: true,
  },
};

Enable recursive directory lookup for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRecursive'.

export default {
  module: {
    exprContextRecursive: true,
  },
};

Sets the default regular expression for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRegExp'.

export default {
  module: {
    exprContextRegExp: true,
  },
};

Set the default request for full dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.exprContextRequest'.

export default {
  module: {
    exprContextRequest: '...',
  },
};

Specify options for each generator.

export default {
  module: {
    generator: {},
  },
};

Don't parse files matching. It's matched against the full resolved request.

export default {
  module: {
    noParse: '...',
  },
};

Specify options for each parser.

export default {
  module: {
    parser: {},
  },
};

An array of rules applied for modules.

export default {
  module: {
    rules: [],
  },
};

Emit errors instead of warnings when imported names don't exist in imported module. Deprecated: This option has moved to 'module.parser.javascript.strictExportPresence'.

export default {
  module: {
    strictExportPresence: true,
  },
};

Handle the this context correctly according to the spec for namespace objects. Deprecated: This option has moved to 'module.parser.javascript.strictThisContextOnImports'.

export default {
  module: {
    strictThisContextOnImports: true,
  },
};

Enable warnings when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextCritical'.

export default {
  module: {
    unknownContextCritical: true,
  },
};

Enable recursive directory lookup when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRecursive'.

export default {
  module: {
    unknownContextRecursive: true,
  },
};

Sets the regular expression when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRegExp'.

export default {
  module: {
    unknownContextRegExp: true,
  },
};

Sets the request when using the require function in a not statically analyse-able way. Deprecated: This option has moved to 'module.parser.javascript.unknownContextRequest'.

export default {
  module: {
    unknownContextRequest: '...',
  },
};

Cache the resolving of module requests.

export default {
  module: {
    unsafeCache: true,
  },
};

Enable warnings for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextCritical'.

export default {
  module: {
    wrappedContextCritical: true,
  },
};

Enable recursive directory lookup for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextRecursive'.

export default {
  module: {
    wrappedContextRecursive: true,
  },
};

Set the inner regular expression for partial dynamic dependencies. Deprecated: This option has moved to 'module.parser.javascript.wrappedContextRegExp'.

export default {
  module: {
    wrappedContextRegExp: undefined,
  },
};

Name of the configuration. Used when loading multiple configurations.

export default {
  name: '...',
};

Include polyfills or mocks for various node stuff.

export default {
  node: false,
};

Include a polyfill for the '__dirname' variable.

export default {
  node: {
    __dirname: "warn-mock",
  },
};

Include a polyfill for the '__filename' variable.

export default {
  node: {
    __filename: "warn-mock",
  },
};

Include a polyfill for the 'global' variable.

export default {
  node: {
    global: "warn",
  },
};

Enables/Disables integrated optimizations.

export default {
  optimization: {},
};

Avoid wrapping the entry module in an IIFE.

export default {
  optimization: {
    avoidEntryIife: true,
  },
};

Check for incompatible wasm types when importing/exporting from/to ESM.

export default {
  optimization: {
    checkWasmTypes: true,
  },
};

Define the algorithm to choose chunk ids (named: readable ids for better debugging, deterministic: numeric hash ids for better long term caching, size: numeric ids focused on minimal initial download size, total-size: numeric ids focused on minimal total download size, false: no algorithm used, as custom one can be provided via plugin).

export default {
  optimization: {
    chunkIds: "natural",
  },
};

Concatenate modules when possible to generate less modules, more efficient code and enable more optimizations by the minimizer.

export default {
  optimization: {
    concatenateModules: true,
  },
};

Emit assets even when errors occur. Critical errors are emitted into the generated code and will cause errors at runtime.

export default {
  optimization: {
    emitOnErrors: true,
  },
};

Also flag chunks as loaded which contain a subset of the modules.

export default {
  optimization: {
    flagIncludedChunks: true,
  },
};

Creates a module-internal dependency graph for top level symbols, exports and imports, to improve unused exports detection.

export default {
  optimization: {
    innerGraph: true,
  },
};

Rename exports when possible to generate shorter code (depends on optimization.usedExports and optimization.providedExports, true/"deterministic": generate short deterministic names optimized for caching, "size": generate the shortest possible names).

export default {
  optimization: {
    mangleExports: "size",
  },
};

Reduce size of WASM by changing imports to shorter strings.

export default {
  optimization: {
    mangleWasmImports: true,
  },
};

Merge chunks which contain the same modules.

export default {
  optimization: {
    mergeDuplicateChunks: true,
  },
};

Enable minimizing the output. Uses optimization.minimizer.

export default {
  optimization: {
    minimize: true,
  },
};

Minimizer(s) to use for minimizing the output.

export default {
  optimization: {
    minimizer: [],
  },
};

Define the algorithm to choose module ids (natural: numeric ids in order of usage, named: readable ids for better debugging, hashed: (deprecated) short hashes as ids for better long term caching, deterministic: numeric hash ids for better long term caching, size: numeric ids focused on minimal initial download size, false: no algorithm used, as custom one can be provided via plugin).

export default {
  optimization: {
    moduleIds: "natural",
  },
};

Avoid emitting assets when errors occur (deprecated: use 'emitOnErrors' instead).

export default {
  optimization: {
    noEmitOnErrors: true,
  },
};

Set process.env.NODE_ENV to a specific value.

export default {
  optimization: {
    nodeEnv: '...',
  },
};

Generate records with relative paths to be able to move the context folder.

export default {
  optimization: {
    portableRecords: true,
  },
};

Figure out which exports are provided by modules to generate more efficient code.

export default {
  optimization: {
    providedExports: true,
  },
};

Use real [contenthash] based on final content of the assets.

export default {
  optimization: {
    realContentHash: true,
  },
};

Removes modules from chunks when these modules are already included in all parents.

export default {
  optimization: {
    removeAvailableModules: true,
  },
};

Remove chunks which are empty.

export default {
  optimization: {
    removeEmptyChunks: true,
  },
};

Create an additional chunk which contains only the webpack runtime and chunk hash maps.

export default {
  optimization: {
    runtimeChunk: "single",
  },
};

Skip over modules which contain no side effects when exports are not used (false: disabled, 'flag': only use manually placed side effects flag, true: also analyse source code for side effects).

export default {
  optimization: {
    sideEffects: "flag",
  },
};

Optimize duplication and caching by splitting chunks by shared modules and cache group.

export default {
  optimization: {
    splitChunks: false,
  },
};

Figure out which exports are used by modules to mangle export names, omit unused exports and generate more efficient code (true: analyse used exports for each runtime, "global": analyse exports globally for all runtimes combined).

export default {
  optimization: {
    usedExports: "global",
  },
};

Options affecting the output of the compilation. output options tell webpack how to write the compiled files to disk.

export default {
  output: {},
};

export default {
  output: {
    amdContainer: '...',
  },
};

The filename of asset modules as relative path inside the 'output.path' directory.

export default {
  output: {
    assetModuleFilename: '...',
  },
};

Enable/disable creating async chunks that are loaded on demand.

export default {
  output: {
    asyncChunks: true,
  },
};

export default {
  output: {
    auxiliaryComment: '...',
  },
};

Add charset attribute for script tag.

export default {
  output: {
    charset: true,
  },
};

Specifies the filename template of output files of non-initial chunks on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    chunkFilename: '...',
  },
};

The format of chunks (formats included by default are 'array-push' (web/WebWorker), 'commonjs' (node.js), 'module' (ESM), but others might be added by plugins).

export default {
  output: {
    chunkFormat: "array-push",
  },
};

Number of milliseconds before chunk request expires.

export default {
  output: {
    chunkLoadTimeout: 0,
  },
};

The method of loading chunks (methods included by default are 'jsonp' (web), 'import' (ESM), 'importScripts' (WebWorker), 'require' (sync node.js), 'async-node' (async node.js), but others might be added by plugins).

export default {
  output: {
    chunkLoading: "jsonp",
  },
};

The global variable used by webpack for loading of chunks.

export default {
  output: {
    chunkLoadingGlobal: '...',
  },
};

Clean the output directory before emit.

export default {
  output: {
    clean: true,
  },
};

Check if to be emitted file already exists and have the same content before writing to output filesystem.

export default {
  output: {
    compareBeforeEmit: true,
  },
};

This option enables cross-origin loading of chunks.

export default {
  output: {
    crossOriginLoading: "anonymous",
  },
};

Specifies the filename template of non-initial output css files on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    cssChunkFilename: '...',
  },
};

Specifies the filename template of output css files on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    cssFilename: '...',
  },
};

Similar to output.devtoolModuleFilenameTemplate, but used in the case of duplicate module identifiers.

export default {
  output: {
    devtoolFallbackModuleFilenameTemplate: '...',
  },
};

Filename template string of function for the sources array in a generated SourceMap.

export default {
  output: {
    devtoolModuleFilenameTemplate: '...',
  },
};

Module namespace to use when interpolating filename template string for the sources array in a generated SourceMap. Defaults to output.library if not set. It's useful for avoiding runtime collisions in sourcemaps from multiple webpack projects built as libraries.

export default {
  output: {
    devtoolNamespace: '...',
  },
};

List of chunk loading types enabled for use by entry points.

export default {
  output: {
    enabledChunkLoadingTypes: [],
  },
};

List of library types enabled for use by entry points.

export default {
  output: {
    enabledLibraryTypes: [],
  },
};

List of wasm loading types enabled for use by entry points.

export default {
  output: {
    enabledWasmLoadingTypes: [],
  },
};

The abilities of the environment where the webpack generated code should run.

export default {
  output: {
    environment: {},
  },
};

Specifies the filename of output files on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    filename: '...',
  },
};

An expression which is used to address the global object/scope in runtime code.

export default {
  output: {
    globalObject: '...',
  },
};

Digest types used for the hash.

export default {
  output: {
    hashDigest: '...',
  },
};

Number of chars which are used for the hash.

export default {
  output: {
    hashDigestLength: 0,
  },
};

Algorithm used for generation the hash (see node.js crypto package).

export default {
  output: {
    hashFunction: '...',
  },
};

Any string which is added to the hash to salt it.

export default {
  output: {
    hashSalt: '...',
  },
};

The filename of the Hot Update Chunks. They are inside the output.path directory.

export default {
  output: {
    hotUpdateChunkFilename: '...',
  },
};

The global variable used by webpack for loading of hot update chunks.

export default {
  output: {
    hotUpdateGlobal: '...',
  },
};

The filename of the Hot Update Main File. It is inside the 'output.path' directory.

export default {
  output: {
    hotUpdateMainFilename: '...',
  },
};

Specifies the filename template of non-initial output html files on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    htmlChunkFilename: '...',
  },
};

Specifies the filename template of output html files on disk. You must not specify an absolute path here, but the path may contain folders separated by '/'! The specified path is joined with the value of the 'output.path' option to determine the location on disk.

export default {
  output: {
    htmlFilename: '...',
  },
};