%20(2).svg)
项目简介
本项目是基于 Vue CLI 构建的移动 Web 应用模板，集成了 Vue、Vuex、Vue Router、axios 等多种前端技术栈，同时使用 ESLint 和 Prettier 统一代码规范与格式，可用于快速搭建移动 Web 应用。
项目的主要特性和功能
- 移动端适配：采用 rem 适配方案，实现页面在不同移动设备上的适配。
- 按需引入 UI 库：按需引入 Vant UI 库，减少打包体积。
- 状态管理：使用 Vuex 进行状态管理，方便组件间的数据共享与交互。
- 路由管理：通过 Vue Router 实现路由管理，支持 hash 和 history 模式。
- HTTP 请求处理：使用 axios 封装统一管理 API，方便处理 HTTP 请求。
- 图标与图片处理：集成图标字体和 SVG 图标组件，支持图片懒加载功能。
- 动画效果：集成 animate.css 动画库，为页面添加动画效果。
- 数据模拟：使用 mockjs 模拟数据请求，便于前后端分离开发。
- 代码规范：集成 ESLint 和 Prettier，统一代码规范和格式。
- 性能优化：包含图片压缩、gZip 压缩、打包分析等性能优化措施。
安装使用步骤
安装依赖
在项目根目录下，打开终端运行以下命令：
bash
npm install
项目配置
项目配置文件主要包括 .eslintrc（ESLint 配置）、.prettierrc（Prettier 配置）、vue.config.js（Vue CLI 配置）等，可根据需求进行调整。
运行项目
在开发环境下启动项目，运行以下命令：
bash
npm run serve
构建项目
构建生产环境版本，运行以下命令：
bash
npm run build
打包分析（可选）
若需要对打包文件进行分析，可按以下步骤操作：
1. 添加 .env.analyz 文件，内容如下：
NODE_ENV = 'production'
IS_ANALYZ = true
2. 在 package.json 的 scripts 中添加：
json
"analyz": "vue-cli-service build --mode analyz"
3. 执行以下命令进行打包分析：
bash
npm run analyz
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】