LivePlayback 项目启动与配置教程

1. 项目目录结构及介绍

LivePlayback 项目采用清晰的目录结构，以下是主要目录及其功能的介绍：

• docs/：存放项目文档，包括用户手册、API 文档等。
• examples/：包含示例代码和项目模板，帮助用户快速上手。
• src/：源代码目录，包含项目的核心功能代码。
  • assets/：存放项目所需的静态资源，如图片、样式表等。
  • components/：存放可复用的 Vue 组件。
  • views/：存放页面级别的 Vue 组件。
  • router/：存放 Vue Router 的路由配置。
  • store/：存放 Vuex 的状态管理。
  • utils/：存放项目工具函数。
• test/：存放单元测试和集成测试代码。
• public/：存放公共文件，如页面图标、入口 HTML 文件等。
• config/：存放项目配置文件。
• package.json：项目依赖和脚本配置文件。
• README.md：项目描述和基本使用说明。

2. 项目的启动文件介绍

项目的启动文件位于 public/index.html 和 src/main.js。

• public/index.html：项目的入口 HTML 文件，定义了页面的基本结构和样式。
• src/main.js：Vue 应用的入口文件，负责初始化 Vue 实例并挂载到 DOM 上。

启动项目的步骤如下：

1. 克隆项目到本地：git clone https://github.com/smartyuge/LivePlayback.git
2. 安装项目依赖：npm install
3. 运行开发环境：npm run serve
4. 打开浏览器，访问 http://localhost:8080 查看项目。

3. 项目的配置文件介绍

项目的配置文件位于 config 目录下。

• config/index.js：项目的通用配置，如端口、API 地址等。
• config/dev.env.js：开发环境的配置。
• config/prod.env.js：生产环境的配置。

配置文件中的关键配置项说明：

• port：项目启动的端口号，默认为 8080。
• devHost：开发环境的 Host。
• prodHost：生产环境的 Host。
• apiBaseUrl：API 请求的基础 URL。

根据需要，开发者可以修改这些配置项来适应不同的开发或部署环境。