Skip to content

Niapya/NuxtHub-Starter

Repository files navigation

NuxtHub Starter

NuxtHub Starter 是一个基于 Nuxt.js 的项目模板,旨在帮助开发者快速搭建现代化的前端应用。

NuxtHub Starter is a Nuxt.js-based project template intended to help developers quickly build modern front-end applications.

它默认集成了 NuxtHub 新版本(^0.10)的功能,NuxtHub 可以轻易地在你的 Nuxt.js 集成 Database、KV Storage、Blob 还有 Cache。新版本的 NuxtHub 是平台无关的,所以支持部署包括本地、Cloudflare 以及 Vercel 等多种的运行环境。

It ships with the new NuxtHub (^0.10) features by default, making it easy to integrate Database, KV Storage, Blob, and Cache into your Nuxt.js app. The new NuxtHub is platform-agnostic and supports deployments to local environments, Cloudflare, Vercel, and more.

我们默认使用 Bun 作为包管理器和构建工具,使用 SQLite 作为数据库,以及开启了 KV 和 Cache,你也可以根据需要更改为其他配置。

We use Bun as the package manager and build tool by default, SQLite as the database, and have KV and Cache enabled. You can change these configurations as needed.

Features

我们集成了很多实用的功能和工具,帮助你更高效地开发和维护项目。

We have integrated many practical features and tools to help you develop and maintain projects more efficiently.

对于后端,集成了 Drizzle ORM 和 Better Auth,提供强大的数据库操作和身份验证支持。

For the backend, we integrate Drizzle ORM and Better Auth to provide robust database operations and authentication support.

对于前端,集成了 Nuxt UI(Tailwind CSS)和 Nuxt Image,我们还安装了 Pinia 和 VueUse,提升开发体验和状态管理能力。

For the frontend, we integrate Nuxt UI (Tailwind CSS) and Nuxt Image, and we also include Pinia and VueUse to enhance development experience and state management.

我们还默认安装了一些诸如 ESLint、Zod、Clsx 等实用的库,帮助你编写代码。

We also include useful libraries like ESLint, Zod, and Clsx by default to help you write better code.

如果你是一个 Vibe Coder,我们还为 VSCode 配置了 Agent.md 文件,一些 Skills(在 .agents/skills 中) 以及 MCP Tools(Context7、Nuxt、Nuxt UI 以及 Nuxt-MCP-DEV),帮助你更好地利用 AI 助手进行开发。

If you're a Vibe Coder, we've also configured an Agent.md file for VSCode, some Skills (in .agents/skills), and MCP Tools (Context7, Nuxt, Nuxt UI, and Nuxt-MCP-DEV) to help you better leverage AI assistants during development.

Quick Start

我们使用 Bun 作为包管理器和构建工具,确保你已经安装了 Bun。

We use Bun as the package manager and build tool; make sure you have Bun installed.

# clone and install denps
bun create Niapya/NuxtHub-Starter my-app

cd my-app

# If you don't use Github Copilot, Add skills for your Agent
bunx --bun skills add better-auth/skills onmax/nuxt-skills

然后,你需要更改 .env 文件中的配置。确保您设置了 NUXT_BASE_URLBETTER_AUTH_SECRET,后者是 Better Auth 所需的密钥,您可以使用 openssl rand -base64 32 生成密钥。

Then, update the configuration in the .env file. Make sure you set NUXT_BASE_URL and BETTER_AUTH_SECRET—the latter is the secret required by Better Auth. You can generate it using openssl rand -base64 32.

NUXT_BASE_URL=<your-base-url>
BETTER_AUTH_SECRET=<your-generated-secret>

然后你就可以使用 bun dev 启动开发服务器了!

Then you can start the development server with bun dev!

bun dev

Configuration

你可以在 nuxt.config.ts 中更改连接配置和其他 NuxtHub 相关配置。

You can change connection settings and other NuxtHub-related configurations in nuxt.config.ts.

export default defineNuxtConfig({
  hub: {
    db: 'sqlite', // https://hub.nuxt.com/docs/database
    kv: true, // https://hub.nuxt.com/docs/kv
    cache: true, // https://hub.nuxt.com/docs/cache
  },
})

Tip

如果你采用不同 SQL 方言,请不要忘记更改 Drizzle Schema 以及 Auth 配置(server/lib/auth)中的 provider

If you adopt a different SQL dialect, be sure to update the Drizzle Schema and the provider in the Auth configuration (server/lib/auth).

对于数据库,数据库架构定义在 server/db/schema/*.ts 中,你可以根据需要添加更多的表和字段,不要忘记在更改 Schema 后运行生成命令。

For the database, the schema is defined in server/db/schema/*.ts. You can add more tables and fields as needed—don't forget to run the generation command after modifying the Schema.

bun run gen:db

Tip

在部署时,数据库迁移会自动进行,详情请看 NuxtHub 数据库迁移文档

Database migrations are applied automatically during deployment; see the NuxtHub database migration documentation for details.

对于验证,Better Auth 的客户端实例在 app/utils/auth.ts,服务端实例在 server/lib/auth。在您更改 Auth 的服务端逻辑后,不要忘记运行 Better Auth 的 CLI 生成 Drizzle Schema,然后对更新的 Schema 使用生成命令。

For authentication, the Better Auth client instance is located at app/utils/auth.ts and the server instance at server/lib/auth. After modifying server-side Auth logic, remember to run the Better Auth CLI to generate the Drizzle Schema and then run the generation command for the updated Schema.

bun run gen:ba && bun run gen:db

Caution

不要轻易改变路径,可能会导致生成失败。

Do not change paths lightly as it may cause generation to fail.

由于新版本的 NuxtHub 与运行商无关,我们并没有一些 CI/CD 配置,你可以阅读 NuxtHub 部署文档 来配置你的部署流程。

Because the new version of NuxtHub is platform-agnostic, we do not provide CI/CD configurations. You can consult the NuxtHub deployment documentation to set up your deployment process.

About

✨ A NuxtHub Starter Template, integrated DB/KV/Auth/Skills/MCP, with AI-Ready 🤖

Topics

Resources

Stars

Watchers

Forks

Contributors