What is webpack-cli?
The webpack-cli npm package provides a command-line interface for the webpack bundler, which allows developers to interact with webpack and its features directly from the command line. It enables tasks such as creating a new webpack project, managing configurations, running the development server, and more.
What are webpack-cli's main functionalities?
Initializing a new webpack project
This command sets up a new webpack project by generating a default configuration file. It can also install webpack and related dependencies if they are not already installed.
webpack-cli init
Generating a configuration file
Generates a webpack configuration file based on the user's preferences. It can be used to quickly scaffold a new configuration or to update an existing one.
webpack-cli generate
Running a webpack build
Executes the webpack build process, which bundles the source files according to the webpack configuration. This is typically used for production builds.
webpack-cli build
Starting a development server
Starts the webpack development server, which provides a live reloading environment for development purposes. It watches for file changes and automatically recompiles the project.
webpack-cli serve
Running webpack in watch mode
Runs webpack in watch mode, where it watches for file changes and recompiles the project as necessary. This is useful during development to see changes reflected immediately.
webpack-cli watch
Other packages similar to webpack-cli
parcel-bundler
Parcel is a web application bundler that offers a similar zero-configuration experience to webpack. It focuses on speed and simplicity, with a built-in development server and hot module replacement. Unlike webpack-cli, Parcel does not require a separate CLI package to run commands.
rollup
Rollup is a module bundler for JavaScript that compiles small pieces of code into something larger and more complex, such as a library or application. It is known for its efficient output and tree-shaking capabilities. Rollup's CLI is included in the main package, unlike webpack which separates the CLI.
browserify
Browserify lets you require('modules') in the browser by bundling up all of your dependencies. It is an older tool compared to webpack and focuses on compatibility with Node.js modules. Browserify's CLI is also part of the main package.
webpack-cli
About
webpack CLI provides a flexible set of commands for developers to increase speed when setting up a custom webpack project. As of webpack v4, webpack is not expecting a configuration file, but often developers want to create a more custom webpack configuration based on their use-cases and needs. webpack CLI addresses these needs by providing a set of tools to improve the setup of custom webpack configuration.
How to install
When you have followed the Getting Started guide of webpack then webpack CLI is already installed!
Otherwise
npm install --save-dev webpack-cli
or
yarn add webpack-cli --dev
Supported arguments and commands
Available Commands
init Initialize a new webpack configuration
migrate Migrate a configuration to a new version
loader Scaffold a loader repository
plugin Scaffold a plugin repository
info Outputs information about your system and dependencies
serve Run the webpack Dev Server
Options
--entry string The entry point of your application.
-c, --config string Provide path to a webpack configuration file
-m, --merge string Merge a configuration file using webpack-merge
--progress Print compilation progress during build
--silent Disable any output that webpack makes
--help Outputs list of supported flags
--defaults Allow webpack to set defaults aggresively
-o, --output string Output location of the file generated by webpack
--plugin string Load a given plugin
-g, --global string[] Declares and exposes a global variable
-t, --target string Sets the build target
-w, --watch Watch for files changes
-h, --hot Enables Hot Module Replacement
-s, --sourcemap string Determine source maps to use
--prefetch string Prefetch this request
-j, --json Prints result as JSON
--standard Prints standard output
-d, --dev Run development build
-p, --prod Run production build
--mode string Defines the mode to pass to webpack
--version Get current version
--node-args string[] NodeJS flags
Defaults
TODO: explain defaults