OpenIsle Docs

前端开发

OpenIsle 前端应用开发指南

前端开发

OpenIsle 前端基于 Nuxt.js 框架构建，提供现代化的用户界面和交互体验。

技术栈

  • Nuxt.js - Vue.js 全栈框架
  • Vue 3 - 前端框架
  • TypeScript - 类型安全
  • Tailwind CSS - 样式框架
  • Pinia - 状态管理

项目结构

frontend_nuxt/
├── components/         # Vue 组件
├── pages/             # 页面路由
├── composables/       # 组合式函数
├── plugins/           # 插件配置
├── utils/             # 工具函数
└── assets/            # 静态资源

开发环境设置

  1. 安装 Node.js 18+
  2. 安装依赖：npm install
  3. 启动开发服务器：npm run dev
  4. 访问 http://localhost:3000

主要功能

  • 用户认证和授权
  • 文章发布和管理
  • 评论和互动
  • 实时消息
  • 用户个人资料
  • 管理后台

组件库

项目使用自定义组件库，主要组件包括：

  • BaseInput - 输入框组件
  • BasePopup - 弹窗组件
  • PostEditor - 文章编辑器
  • CommentEditor - 评论编辑器