@rspack/dev-server

Use Rspack with a development server that provides live reloading. This should be used for development only.

> @rspack/dev-server is based on webpack-dev-server@5

Installation

First of all, install @rspack/dev-server and @rspack/core by your favorite package manager:

``bash


npm

$ npm install @rspack/dev-server @rspack/core --save-dev

yarn

$ yarn add @rspack/dev-server @rspack/core --dev

pnpm

$ pnpm add @rspack/dev-server @rspack/core --save-dev

bun

$ bun add @rspack/dev-server @rspack/core -D
`

Usage

There are two recommended ways to use @rspack/dev-server:

$3

The easiest way to use it is with the @rspack/cli.

You can install it in your project by:

`bash


npm

$ npm install @rspack/cli --save-dev

yarn

$ yarn add @rspack/cli --dev

pnpm

$ pnpm add @rspack/cli --save-dev

bun

$ bun add @rspack/cli -D
`

And then start the development server by:

`bash


with rspack.config.js

$ rspack serve

with custom config file

$ rspack serve -c ./your.config.js
`

> See CLI for more details.

While starting the development server, you can specify the configuration by the devServer field of your Rspack config file:

`js
// rspack.config.mjs
export default {
// ...
devServer: {
// the configuration of the development server
port: 8080,
},
};
`

> See DevServer for all configuration options.

$3

While it's recommended to run @rspack/dev-server via the CLI, you may also choose to start a server via the API.

`js
import { RspackDevServer } from '@rspack/dev-server';
import rspack from '@rspack/core';
import rspackConfig from './rspack.config.mjs';

const compiler = rspack(rspackConfig);
const devServerOptions = {
...rspackConfig.devServer,
// override
port: 8888,
};

const server = new RspackDevServer(devServerOptions, compiler);

server.startCallback(() => {
console.log('Successfully started server on http://localhost:8888');
});
`

> Cause @rspack/dev-server is based on webpack-dev-server@5`, you can see the webpack-dev-server API for more methods of the server instance.

Credits

This plugin is forked from webpack-dev-server, and is used to smooth out some differences between rspack and webpack, while also providing rspack-specific new features.

> Thanks to the webpack-dev-server project created by @sokra

License

MIT licensed.