465 - 《TanStack Start》

现在开发一个框架真是太简单了，TanStack Start 和 Solid Start 都是套壳 Vinxi + Vite + Nitro，然后加自己的路由、runtime 和 Vite 插件就完成了。

1、TanStack Start 是啥？我理解他是基于 TanStack Router 的浅层封装，其打包基于 Vinxi 和 Vite，其部署基于 Nitro。功能上支持 SSR、流、server function、RPCs、打包等功能。全栈框架。

2、快速上手。参考 https://tanstack.com/router/latest/docs/framework/react/start/getting-started 10 分钟能跑一遍流程，带安装依赖。

3、整体是组装式的，很白盒。整体目录如下，router.tsx 定义路由，client.tsx 做 client 渲染，ssr.tsx 做服务端渲染，routes 下定义路由，routes/__root.tsx 决定路由的整体结构。组装式指的是，框架提供方法，然后交给你组装，好处是主动权完全在自己手上。

.
├── app/
│   ├── routes/
│   │   └── __root.tsx
│   ├── client.tsx
│   ├── router.tsx
│   ├── routeTree.gen.ts
│   └── ssr.tsx
├── .gitignore
├── app.config.ts
├── package.json
└── tsconfig.json

4、官方推荐了 Vercel 做部署，Clerk 做用户认证，Convex 做数据库，Sentry 做监控。

5、源码见 https://github.com/TanStack/router/blob/main/packages/start ，入口在 src/config/index.ts#defineConfig，返回 vinxi 的配置，然后交给 vinxi 做 build 和 dev。从配置上看，需要打 3 个包，分别是 client、ssr 和 server function。

6、如何实现 server function 功能？（注：源码里的 tsr 表示 tanstack router，我想了好久这个简写代表啥…）

1）打包 client 时，用 @vinxi/server-func