跳到主要内容

Web 应用

Web 应用是基于 Nuxt 框架构建的 SSR/SSG 应用，主要面向最终用户。

技术栈​

  • 框架: Nuxt 3
  • 渲染: SSR/SSG
  • UI: TDesign Vue Next
  • 状态管理: Pinia
  • 路由: Nuxt Router
  • 样式: UnoCSS

功能特性​

SEO 优化​

  • 服务端渲染
  • 元标签管理
  • 结构化数据
  • 站点地图

性能优化​

  • 代码分割
  • 懒加载
  • 缓存策略
  • 图片优化

用户体验​

  • 响应式设计
  • 无障碍访问
  • 国际化支持
  • 主题切换

开发指南​

环境搭建​

cd hosts/web
pnpm install
pnpm dev

构建部署​

# 静态生成
pnpm generate

# 服务端渲染
pnpm build

配置文件​

  • nuxt.config.ts: Nuxt 配置
  • app.config.ts: 应用配置
  • tailwind.config.js: 样式配置

页面结构​

页面路由​

pages/
├── index.vue           # 首页
├── about.vue           # 关于页面
└── [...slug].vue       # 动态路由

组件结构​

components/
├── layout/             # 布局组件
├── common/             # 通用组件
└── business/           # 业务组件

部署配置​

环境变量​

  • NUXT_PUBLIC_API_URL: API 地址
  • NUXT_PUBLIC_APP_NAME: 应用名称

构建配置​

  • 目标环境：Node.js 18+
  • 输出目录：.output
  • 静态资源：public