如何在SvelteKit开发环境中使用自定义Express服务器

SvelteKit默认开发环境依赖Vite内置服务器，要让自定义Express服务器在开发环境生效，需要用Express托管Vite的开发中间件，同时集成SvelteKit的SSR处理，具体步骤如下：

1. 编写自定义开发服务器文件 #

在项目根目录新建dev-server.js，内容如下：

import express from 'express';
import { createServer as createViteServer } from 'vite';
import { sveltekit } from '@sveltejs/kit/vite';

async function createServer() {
  const app = express();

  // 初始化Vite开发服务器，启用中间件模式并集成SvelteKit
  const viteServer = await createViteServer({
    server: { middlewareMode: true },
    plugins: [sveltekit()]
  });

  // 挂载Vite开发中间件（处理热更新、静态资源编译等）
  app.use(viteServer.middlewares);

  // 在这里添加你的自定义Express路由/中间件
  app.get('/custom-api', (req, res) => {
    res.json({ status: 'success', message: '开发环境自定义API响应' });
  });

  // 让Vite处理SvelteKit的页面请求
  app.use('*', async (req, res) => {
    try {
      // 动态加载SvelteKit的处理函数（由Vite实时编译）
      const { handler } = await viteServer.ssrLoadModule('$app/handler');
      handler(req, res);
    } catch (err) {
      viteServer.ssrFixStacktrace(err);
      console.error('SvelteKit请求处理出错:', err);
      res.status(500).send(err.message);
    }
  });

  const port = process.env.PORT || 5173;
  app.listen(port, () => {
    console.log(`开发服务器已启动: http://localhost:${port}`);
  });
}

createServer();

2. 修改开发启动命令 #

打开package.json，将原来的dev命令替换为：

"scripts": {
  "dev": "node dev-server.js",
  // 其他命令（build、preview等）保持不变
}

注意：如果你的项目没有设置"type": "module"，需要改用CommonJS语法（将import换成require），或者在命令中添加兼容参数：
"dev": "node --no-warnings --experimental-specifier-resolution=node dev-server.js"

3. 验证运行 #

执行npm run dev，访问http://localhost:5173可以看到SvelteKit页面，访问http://localhost:5173/custom-api可以看到自定义API的响应，同时热更新功能也能正常工作。

关键注意事项 #

• 自定义路由要放在app.use(viteServer.middlewares)之后、SvelteKit的handler之前，避免被SvelteKit的路由规则拦截
• 如果需要处理POST请求或解析JSON，记得添加app.use(express.json())这类中间件
• 确保项目已安装express、vite、@sveltejs/kit依赖（这些你应该已经配置完成）

内容的提问来源于stack exchange，提问作者lazar