Skip to content
Latchkey

webpack --config: Multiple Config Files

webpack --config points the build at a specific config file, so you can keep separate prod and dev configurations.

Larger projects split webpack config per target. --config plus --env lets one CI command build exactly the variant you want without editing files.

What it does

webpack --config loads the named module as the build configuration instead of the default webpack.config.js. When the config exports a function, --env passes values into it so one file can branch on target.

Common usage

Terminal
webpack --config config/webpack.prod.js
# a function config reading --env
webpack --config webpack.config.js --env production --env cdn=https://cdn.example.com

Options

FlagWhat it does
--config <file>Config module to load
--config-name <n>Pick one config by name from an array export
--env key=valuePass a value to a function-style config
--mergeMerge multiple --config files

In CI

Reference configs by repo-relative path so the command is identical on every runner. If the config is ESM (.mjs) or TypeScript, ensure the loader (for example ts-node) is a devDependency or the config import fails only in CI.

Common errors in CI

"Unable to load \"...\" config" means the --config path is wrong relative to the working directory the runner uses. "You provided \"--env\" ... but the config is not a function" means the config exports an object, so --env is ignored. A TypeScript config throwing "Cannot use import statement outside a module" means the TS/ESM loader is not registered.

Related guides

Run this faster and cheaper on Latchkey managed runners. Start free →