Object
该配置选项只作用于服务端路由,可以自定义应用入口的服务访问配置。
对象的 key
为当前应用的入口名, 值可以是 string | Array<string>
。
当值类型为 string
时,当前值即表示访问该入口的路由名称。
export default defineConfig({
server: {
routes: {
// 默认路由为 /entryName1,自定义后为 /p/test1
entryName1: '/p/test1'
// 支持动态服务端路由配置
entryName2: '/detail/:id'
}
}
});
也可以通过 Array<string>
为入口设置多个访问路由:
export default defineConfig({
server: {
routes: {
'page-a': [`/a`, '/b'],
},
},
});
此时,通过 /a
、/b
两个路由都可以访问到 page-a
入口。
执行 dev
命令后,可以在 dist/route.json
中查看入口 page-a
存在两条路由记录:
{
"routes": [
{
"urlPath": "/a",
"entryName": "page-a",
"entryPath": "html/page-a/index.html",
"isSPA": true,
"isSSR": false
},
{
"urlPath": "/b",
"entryName": "page-a",
"entryPath": "html/page-a/index.html",
"isSPA": true,
"isSSR": false
}
]
}
可以通过配置入口的 resHeaders 设置响应头:
export default defineConfig({
server: {
routes: {
'page-a': {
route: ['/a', '/b'],
resHeaders: {
'x-modern-test': '1',
},
},
},
},
});
NOTE
这一配置在生产环境与开发环境都生效,可以根据 NODE_ENV 区分环境设置不同的响应头。但如果你只需要在开发环境设置响应头,推荐使用 tools.devServer.headers
。