webpack-serve

4.0.0 verified Sat Apr 25 auth: no javascript

A CLI wrapper for webpack-plugin-serve, providing a premier webpack development server. Current stable version is 4.0.0 (as of last release, no updates since). Release cadence has been sporadic; the package was forked from webpack-contrib/webpack-serve and is now maintained separately. Key differentiators: offers a simple CLI interface for webpack-plugin-serve, supports HMR, live reload, HTTP2, compression, history API fallback, and progress. However, the authors recommend using webpack-plugin-serve directly with webpack-nano instead of this CLI. Only works with Node versions 8.0.0-8.x, 10.0.0-10.13.x, and >=10.15.0 (not 10.14.0 due to a bug). Requires webpack ^4.29.0 as a peer dependency.

Common errors

error Error: Cannot find module 'webpack-plugin-serve' ↓

cause Missing required peer dependency webpack-plugin-serve (installed automatically with npm v7+ but not npm v6).

fix

Install webpack-plugin-serve explicitly: npm install webpack-plugin-serve --save-dev

error webpack-serve requires a peer of webpack@^4.29.0 but none was installed. ↓

cause webpack is not installed or version mismatch.

fix

Install webpack 4.29+: npm install webpack@^4.29.0 --save-dev

error TypeError: serve is not a function ↓

cause Attempting to use webpack-serve programmatically with require('webpack-serve') in v3+.

fix

Use webpack-plugin-serve directly: const WebpackPluginServe = require('webpack-plugin-serve');

error Node v10.14.0 is not supported. Please use a supported version. ↓

cause Node 10.14.0 has a known bug that breaks webpack-serve.

fix

Upgrade Node to >=10.15.0 or downgrade to 10.13.x.

Warnings

breaking v3.0.0 removed the programmatic API; webpack-serve is now CLI-only. ↓

fix Use webpack-plugin-serve directly for programmatic usage.

breaking Node version restrictions: v8.0.0-8.x, v10.0.0-10.13.x, >=10.15.0 (10.14.0 excluded due to bug). ↓

fix Use a supported Node version. If on 10.14.0, upgrade to 10.15.0 or later.

deprecated Recommendation from authors: use webpack-plugin-serve with webpack-nano instead of this CLI. ↓

fix Switch to webpack-plugin-serve and webpack-nano for more flexibility.

gotcha The --http2 flag requires Node.js built-in HTTP2 support, which may not work with all Node versions. ↓

fix Ensure your Node version has HTTP2 support (Node >=8.4.0 with --http2 flag).

gotcha webpack-plugin-serve feature parity may differ from webpack-dev-server, especially for complex configurations. ↓

fix Review the Feature Comparison doc before migrating.

Install

npm install webpack-serve

yarn add webpack-serve

pnpm add webpack-serve

Imports

default (CLI)
wrong
```
const serve = require('webpack-serve')
```
correct
```
npx webpack-serve --config webpack.config.js
```
webpack-serve v3+ is a CLI-only tool; it does not export a programmatic API. Use webpack-plugin-serve directly for API usage.
programmatic API (v2.x)
wrong
```
import serve from 'webpack-serve'
```
correct
```
const serve = require('webpack-serve'); serve({ config: './webpack.config.js' })
```
Prior to v3, webpack-serve exported a function. In v3+ the programmatic API is removed; use webpack-plugin-serve instead.

webpack-plugin-serve usage

wrong

const WebpackPluginServe = require('webpack-serve')

correct

const WebpackPluginServe = require('webpack-plugin-serve'); plugins.push(new WebpackPluginServe({ port: 8080 }))

webpack-serve v3+ is a thin CLI over webpack-plugin-serve. For config-based setups, use webpack-plugin-serve directly.

Quickstart

Demonstrates installing webpack-serve, configuring webpack-plugin-serve in webpack.config.js, and running the CLI with options for port and auto-open browser.

npm install webpack-serve --save-dev
# webpack.config.js
const WebpackPluginServe = require('webpack-plugin-serve');
const { watch } = require('fs');

module.exports = {
  entry: './src/index.js',
  output: { path: __dirname + '/dist' },
  plugins: [
    new WebpackPluginServe({
      port: process.env.PORT || 8080,
      static: __dirname + '/public',
      liveReload: true,
      hmr: true
    })
  ]
};

# Run with CLI
npx webpack-serve --config webpack.config.js --port 8080 --open