# vue3-base-h5

**Repository Path**: joke.com/vue3-base-h5

## Basic Information

- **Project Name**: vue3-base-h5
- **Description**: 基于vue3+vite+vant，集成echarts,高德地图h5基础框架
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 1
- **Created**: 2022-07-05
- **Last Updated**: 2023-09-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: vue框架

## README

### 基于vue3 + vite + vant  开箱即用框架（移动端）

### **1. 待办**

- [x] 集成echarts
- [x] 集成高德地图
- [ ] eslint+prettier 代码校验和格式化
- [ ] ...

### **2.项目文件说明**
- .env.development（参数VITE_APP_PROXY_UR 根据项目需要填写对应的代理域名）
- src
    - api
        - **module** (存放对应模块的api接口请求)
        - **comm**（存放公共的api接口请求）
    - assets（存放图片文件）
    - component（存放公共组件）
    - hooks
        - **module** （存放功能模块）
    - lib
        - **amap**（封装的高德地图组件）
        - **echarts**（封装的echarts组件）
    - router
        - **module**（存放模块文件）
        - **index**（路由入口）
    - store
        - **module**（存放模块文件）
        - **index**（状态管理入口）
    - style
        - **comm****（公共模块）
        - **index**（样式入口）
    - utils
        - **auth**（仅token本地存储相关操作）
        - **common**（公共工具）
        - **request***（axios请求）
        - **sha1**（接口登陆密码加密文件）
    - view
        - **demo** (示例文件，**可删除**)
        - **error-page** (用于404页面跳转)
        - **login** (用于本地登陆获取token调试使用)


<em>注：其他文件根据自己需要做删减</em>

### **3.接口调试说明**
不推荐：mock.js


推荐使用**ApiFox**软件作为mock的替代，只需要将接口文档导入再开启远程mock开关，即可自动按照接口定义的规则生成数据源，方便调试使用
####[APIFox使用方法点击这里](https://www.apifox.cn/help/)


### **4.注意事项**
- 1.除了demo文件可以删除其他资源可以保留，如有需要可自行根据业务情况进行删改
- 2.vite.config.js文件里的'/api'代理的是APIFOX的在线mock地址，仅用于本地调试使用
- 3.setting.js文件中的AMAP_KEY仅用于调试使用，上线请替换使用自己申请的key及index.html页面的securityJsCode值
- 4.login文件不建议删除，方便本地获取token调试使用，接口为真实接口返回的token，只有在开发环境才会出现此页面，构建后的线上出现401等未授权情况将不会跳转到此页面，可放心使用