项目结构
ShipSaaS 模板文件和文件夹组织概述
ShipSaaS 遵循基于 TanStack Router 文件路由的模块化架构,专注于可扩展性和可维护性。
根目录结构
src
api
auth
components
config
db
env
hooks
lib
messages
middlewares
newsletter
notification
payment
storage
routes
types
styles.css
content
public
scripts
biome.json
content-collections.ts
drizzle.config.ts
drizzle.config.local.ts
vite.config.ts
wrangler.jsonc
关键文件
vite.config.ts:Vite 配置,含 ShipStack (NextJS)、Cloudflare、Tailwind CSS 和 Content Collections 插件wrangler.jsonc:Cloudflare Workers 配置,包括 D1 数据库和 R2 存储绑定content-collections.ts:博客、法律条款页面和更新日志的 Content Collections 配置drizzle.config.ts:数据库的 Drizzle ORM 配置biome.json:Biome 代码检查和格式化配置.env.example:环境变量模板
关键目录
/src/api 目录
按功能组织的服务端 API 逻辑:
contact.ts
newsletter.ts
payment.ts
user-files.ts
users.ts
/src/lib 目录
核心应用程序逻辑和实用程序:
blog.ts
changelog.ts
formatter.ts
markdown.ts
pages.ts
price-plan.ts
routes.ts
seo.ts
urls.ts
utils.ts
/src/routes 目录
routes 目录遵循 TanStack Router 文件路由约定:
__root.tsx
index.tsx
auth
dashboard
settings
admin
(pages)
(legals)
blog
api
/src/components 目录
组件按功能和用途组织,以便更好地维护:
共享组件
共享组件在整个应用程序中可重用,并在专用目录中组织:
ui
blocks
layout
shared
theme
analytics
chatbox
affiliate
功能模块的组件
组件目录按功能组织,便于定位和维护与特定功能相关的组件,如身份验证、博客、仪表盘等。
admin
auth
blog
changelog
contact
dashboard
payment
pricing
settings
waitlist
下一步
现在您了解了项目结构,探索这些相关主题: