webpack CLI

The official Command Line Interface of webpack

Table of Contents

• Introduction
  • How to install
• Supported arguments and commands
• Packages
  • Commands
• Getting started
• Shell completion
• Exit codes and their meanings
• Contributing and Internal Documentation
• Funding

Introduction

Webpack CLI provides the interface of options webpack uses in its configuration file. The CLI options override options passed in the configuration file.

The CLI provides a rich set of commands that helps you develop your application faster.

How to install

If you have followed the Getting Started guide of webpack then webpack CLI is already installed!

Otherwise npm install --save-dev webpack-cli, yarn add webpack-cli --dev or pnpm add --D webpack-cli will install it.

Supported arguments and commands

Get to know what are the available commands and arguments here.

Packages

The main CLI logic using options, resides in packages/webpack-cli.

A summary of supported commands is described below.

Commands

Supporting developers is an important task for webpack CLI. Thus, webpack CLI provides different commands for many common tasks.

• build|bundle|b [entries...] [options] - Run webpack (default command, can be omitted).
• complete [shell] - Print a shell completion script, see Shell completion.
• configtest|t [config-path] - Validate a webpack configuration.
• help|h [command] [option] - Display help for commands and options.
• info|i [options] - Returns information related to the local environment.
• serve|server|s [entries...] [options] - Use webpack with a development server that provides live reloading.
• version|v [commands...] - Output the version number of webpack, webpack-cli, webpack-dev-server, and commands.
• watch|w [entries...] [options] - Run webpack and watch for files changes.

Getting started

If you have followed the Getting Started guide of webpack, then webpack CLI is already installed!

Otherwise, you would need to install webpack CLI and the packages you want to use.

If you want to create a fresh webpack project run the command as stated below:

npx create-webpack-app init

You will then be prompted for some questions about which features you want to use, such as scss, typescript, PWA support or other features.

Shell completion

Commands, their options and the values those options accept can be completed in zsh, bash, fish and powershell. The completions are read from webpack's own schema, so they cover whatever your webpack and webpack-dev-server versions support.

Completion is served by @bomb.sh/tab, which is optional and not installed with webpack-cli:

npm install --save-dev @bomb.sh/tab

Then load the script for your shell:

# zsh
echo 'source <(webpack complete zsh)' >> ~/.zshrc

# bash
echo 'source <(webpack complete bash)' >> ~/.bashrc

# fish
webpack complete fish > ~/.config/fish/completions/webpack.fish

# powershell
webpack complete powershell > ~/.webpack-completion.ps1
echo '. ~/.webpack-completion.ps1' >> $PROFILE

Once the shell is restarted, Tab completes commands, their aliases, options and option values:

webpack b<Tab>              # webpack build
webpack build --mode=<Tab>  # development, production, none
webpack serve --his<Tab>    # webpack serve --history-api-fallback

Exit codes and their meanings

Exit Code	Description
0	Success
1	Errors from webpack
2	Configuration/options problem or an internal error

Contributing and Internal Documentation

The webpack family welcomes any contributor, small or big. We are happy to elaborate, guide you through the source code and find issues you might want to work on! To get started have a look at our contribution documentation.

Funding

If you like webpack, please consider donating through Open Collective to help us keep the project relevant.

Code of Conduct

Guidelines to how the webpack organization expects you to behave is documented under Code of Conduct