快速开始
从一个全新的 Nitro 项目开始,或在现有的 Vite 项目中采用它。
在线试用 Nitro
在我们的游乐场中通过浏览器体验 Nitro。
创建 Nitro 项目
创建 Nitro 应用最快的方式是使用 create-nitro-app。
npx create-nitro-app
yarn dlx create-nitro-app
pnpm dlx create-nitro-app
bunx create-nitro-app
deno run -A npm:create-nitro-app
预览
按照 CLI 的说明操作,然后你就可以启动开发服务器了。
添加到 Vite 项目
你可以将 Nitro 添加到任何现有的 Vite 项目中,以获得 API 路由、服务端渲染等功能。
安装 nitro 和 vite
npm i nitro vite
yarn add nitro vite
pnpm i nitro vite
bun i nitro vite
deno i npm:nitro vite
向 Vite 添加 Nitro 插件
将 Nitro 插件添加到你的 vite.config.ts 中:
vite.config.ts
import { defineConfig } from "vite";
import { nitro } from "nitro/vite";
export default defineConfig({
plugins: [
nitro()
],
});
配置 Nitro
创建 nitro.config.ts 来配置服务器目录:
nitro.config.ts
import { defineNitroConfig } from "nitro/config";
export default defineNitroConfig({
serverDir: "./server",
});
serverDir 选项告诉 Nitro 在哪里查找你的服务器路由。在这个例子中,所有路由都将位于 server/ 目录内。
创建 API 路由
在 server/api/test.ts 创建你的第一个 API 路由:
server/api/test.ts
import { defineHandler } from "nitro";
export default defineHandler(() => {
return { message: "Hello Nitro!" };
});
文件路径直接映射到路由 URL — server/api/test.ts 变为 /api/test。
作为文件系统路由的替代方案,你可以使用
routes 配置选项以编程方式声明路由。查看 程序化路由处理器 了解更多详情。你可以从处理器中返回字符串、JSON 对象、
Response 实例或可读流。查看 路由 了解更多关于动态路由、方法和中间件的信息。启动开发服务器
npm run dev -- --open
yarn dev -- --open
pnpm dev -- --open
bun run dev -- --open
deno run dev -- --open
你的 API 路由现在可以通过 http://localhost:3000/api/test 访问了 ✨