Skip to content

Commit ed7b63c

Browse files
authored
docs: add server.middlewareMode config (#4621)
1 parent bfcb124 commit ed7b63c

File tree

8 files changed

+118
-6
lines changed

8 files changed

+118
-6
lines changed

website/docs/en/api/javascript-api/dev-server-api.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,13 @@ import express from 'express';
140140

141141
async function startDevServer() {
142142
// Init Rsbuild
143-
const rsbuild = await createRsbuild({});
143+
const rsbuild = await createRsbuild({
144+
rsbuildConfig: {
145+
server: {
146+
middlewareMode: true,
147+
},
148+
},
149+
});
144150

145151
const app = express();
146152

@@ -159,7 +165,11 @@ async function startDevServer() {
159165
}
160166
```
161167

162-
For detailed usage, please refer to: [Example](https://github.com/rspack-contrib/rspack-examples/blob/main/rsbuild/express/server.mjs).
168+
For detailed usage, please refer to:
169+
170+
- [Example code](https://github.com/rspack-contrib/rspack-examples/blob/main/rsbuild/express/server.mjs).
171+
- [rsbuild.createDevServer](/api/javascript-api/instance#rsbuildcreatedevserver)
172+
- [server.middlewareMode](/config/server/middleware-mode)
163173

164174
### connectWebSocket
165175

website/docs/en/community/releases/v0-5.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,13 @@ import { createRsbuild } from '@rsbuild/core';
5050

5151
async function startCustomServer() {
5252
const app = express();
53-
const rsbuild = await createRsbuild();
53+
const rsbuild = await createRsbuild({
54+
rsbuildConfig: {
55+
server: {
56+
middlewareMode: true,
57+
},
58+
},
59+
});
5460
const { port, middlewares } = await rsbuild.createDevServer();
5561

5662
app.use(middlewares);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# server.middlewareMode
2+
3+
- **Type:** `boolean`
4+
- **Default:** `false`
5+
- **Version:** `>= 1.2.12`
6+
7+
Whether to create Rsbuild's server in middleware mode, which is useful for integrating with other servers.
8+
9+
When this option is enabled, Rsbuild will not create an HTTP server. This option is usually only needed when using the JavaScript API of Rsbuild.
10+
11+
## Example
12+
13+
A typical use case is that you want to integrate the Rsbuild server into a custom server. You can achieve this by combining `server.middlewareMode` and [rsbuild.createDevServer](/api/javascript-api/instance#rsbuildcreatedevserver).
14+
15+
```ts
16+
import { createRsbuild } from '@rsbuild/core';
17+
import express from 'express';
18+
19+
async function startDevServer() {
20+
// Initialize Rsbuild in middleware mode
21+
const rsbuild = await createRsbuild({
22+
rsbuildConfig: {
23+
server: {
24+
middlewareMode: true,
25+
},
26+
},
27+
});
28+
29+
const app = express();
30+
31+
// Create Rsbuild dev server instance
32+
const rsbuildServer = await rsbuild.createDevServer();
33+
34+
// Apply Rsbuild's built-in middlewares
35+
app.use(rsbuildServer.middlewares);
36+
}
37+
```
38+
39+
> See [Integrate with custom server](/api/javascript-api/dev-server-api#integrate-with-custom-server) for more details.

website/docs/en/guide/migration/vite.mdx

+1
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,7 @@ Here is the corresponding Rsbuild configuration for Vite configuration:
137137
| server.proxy, preview.proxy | [server.proxy](/config/server/proxy) |
138138
| server.headers, preview.headers | [server.headers](/config/server/headers) |
139139
| server.hmr | [dev.hmr](/config/dev/hmr), [dev.client](/config/dev/client) |
140+
| server.middlewareMode | [server.middlewareMode](/config/server/middleware-mode) |
140141
| build.target, build.cssTarget | [Browserslist](/guide/advanced/browserslist) |
141142
| build.outDir, build.assetsDir | [output.distPath](/config/output/dist-path) |
142143
| build.assetsInlineLimit | [output.dataUriLimit](/config/output/data-uri-limit) |

website/docs/zh/api/javascript-api/dev-server-api.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,13 @@ import express from 'express';
140140

141141
async function startDevServer() {
142142
// 初始化 Rsbuild
143-
const rsbuild = await createRsbuild({});
143+
const rsbuild = await createRsbuild({
144+
rsbuildConfig: {
145+
server: {
146+
middlewareMode: true,
147+
},
148+
},
149+
});
144150

145151
const app = express();
146152

@@ -159,7 +165,11 @@ async function startDevServer() {
159165
}
160166
```
161167

162-
完整用法可参考:[示例](https://github.com/rspack-contrib/rspack-examples/blob/main/rsbuild/express/server.mjs)
168+
更多用法可参考:
169+
170+
- [示例代码](https://github.com/rspack-contrib/rspack-examples/blob/main/rsbuild/express/server.mjs)
171+
- [rsbuild.createDevServer](/api/javascript-api/instance#rsbuildcreatedevserver)
172+
- [server.middlewareMode](/config/server/middleware-mode)
163173

164174
### connectWebSocket
165175

website/docs/zh/community/releases/v0-5.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,13 @@ import { createRsbuild } from '@rsbuild/core';
5050

5151
async function startCustomServer() {
5252
const app = express();
53-
const rsbuild = await createRsbuild();
53+
const rsbuild = await createRsbuild({
54+
rsbuildConfig: {
55+
server: {
56+
middlewareMode: true,
57+
},
58+
},
59+
});
5460
const { port, middlewares } = await rsbuild.createDevServer();
5561

5662
app.use(middlewares);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# server.middlewareMode
2+
3+
- **类型:** `boolean`
4+
- **默认值:** `false`
5+
- **版本:** `>= 1.2.12`
6+
7+
是否以中间件模式来创建 Rsbuild 的 server,这有助于与其他 server 集成。
8+
9+
开启此选项后,Rsbuild 将不会创建 HTTP server。通常你只有在使用 Rsbuild 的 JavaScript API 时,才需要设置此选项。
10+
11+
## 示例
12+
13+
一个典型的使用场景是,你希望将 Rsbuild 的 server 集成到自定义的 server 中。可以结合 `server.middlewareMode`[rsbuild.createDevServer](/api/javascript-api/instance#rsbuildcreatedevserver) 来实现。
14+
15+
```ts
16+
import { createRsbuild } from '@rsbuild/core';
17+
import express from 'express';
18+
19+
async function startDevServer() {
20+
// 以 middleware mode 初始化 Rsbuild
21+
const rsbuild = await createRsbuild({
22+
rsbuildConfig: {
23+
server: {
24+
middlewareMode: true,
25+
},
26+
},
27+
});
28+
29+
const app = express();
30+
31+
// 创建 Rsbuild dev server 实例
32+
const rsbuildServer = await rsbuild.createDevServer();
33+
34+
// 使用 Rsbuild 的内置中间件
35+
app.use(rsbuildServer.middlewares);
36+
}
37+
```
38+
39+
> 查看 [与自定义 server 集成](/api/javascript-api/dev-server-api#与自定义-server-集成) 了解更多。

website/docs/zh/guide/migration/vite.mdx

+1
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,7 @@ Rsbuild 会在构建时自动注入 `<script>` 标签到生成的 HTML 文件中
137137
| server.proxy, preview.proxy | [server.proxy](/config/server/proxy) |
138138
| server.headers, preview.headers | [server.headers](/config/server/headers) |
139139
| server.hmr | [dev.hmr](/config/dev/hmr), [dev.client](/config/dev/client) |
140+
| server.middlewareMode | [server.middlewareMode](/config/server/middleware-mode) |
140141
| build.target, build.cssTarget | [Browserslist](/guide/advanced/browserslist) |
141142
| build.outDir, build.assetsDir | [output.distPath](/config/output/dist-path) |
142143
| build.assetsInlineLimit | [output.dataUriLimit](/config/output/data-uri-limit) |

0 commit comments

Comments
 (0)