# 19-某外卖平台项目实训_Android

**Repository Path**: zhang-jipeng/Meileme

## Basic Information

- **Project Name**: 19-某外卖平台项目实训_Android
- **Description**: 前端技术：vue
后端技术：springcloud
此项目用于2022年6月北城的实训测试课

- **Primary Language**: Unknown
- **License**: MPL-2.0
- **Default Branch**: develop
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2022-05-27
- **Last Updated**: 2025-07-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Vue, SpringCloud, IDEA, VSCode

## README

# 19-某外卖平台项目实训_Android
#### 介绍
前端技术：vue
后端技术：springcloud

#### 软件架构
软件架构说明


#### 安装教程

1.  Vue框架搭建：
    1.查询本机环境	命令：node -v	/*node.js版本，验证安装*/
		V16.15.0
		命令：npm -v	/*npm版本，验证安装*/
		8.5.5
		命令：vue --version	/*@vue/cli版本，验证安装*/
		@vue/cli  5.0.4
    2.未安装vue	命令：npm config set registry https://registry.npm.taobao.org	/*更换镜像*/
		命令：npm install -g @vue/cli
    3.环境安装后执行	命令：vue ui
    出现	Starting GUI.....
	Ready on http://localhost:****	/*localhost是本地连接号，复制到浏览器运行一下，出现页面即为成功*/
    4.从gitee上同步框架至本地Vscode文件夹
	这里说明下：我们所使用的的Vue框架为x3.0目前最稳定的版本，一切框架设置皆为默认
    5.在本地Vscode
   新建终端执行	命令：npm run serve
    出现	INFO Starting development server...
	        Done Compiled successfully in ****ms
	        App running at：
		    - Local：http://localhost:****/
		    - Network：http:***.***.***.***:****/
    直接CTRL+左键Local地址跟踪链接，验证框架是否搭建成功
    出现	Welcome to Your Vue.js App	视为成功
2.  Vue框架基本学习已经完成，进入开发准备阶段
由于前面未能使用APIcloud技术，这里直接选择放弃，用了原始方法
Vscode准备组件
	1.Vetur —— 语法高亮、智能感知、Emmet等
	包含格式化功能， Alt+Shift+F （格式化全文），Ctrl+K Ctrl+F（格式化选中代码，两个Ctrl需要同时按着）
	2.EsLint —— 语法纠错
	3.Auto Close Tag —— 自动闭合HTML/XML标签
	4.Auto Rename Tag —— 自动完成另一侧标签的同步修改
	5.JavaScript(ES6) code snippets —— ES6语法智能提示以及快速输入，除js外还支持.ts，.jsx，.tsx，.html，.vue，省去		了配置其支持各种包含js代码文件的时间
	6.Path Intellisense —— 自动路径补全
	7.HTML CSS Support —— 让 html 标签上写class 智能提示当前项目所支持的样式
	8.Beautify——格式化代码，值得注意的是，beautify插件支持自定义格式化代码规则
	9.Bracket Pair Colorizer——给括号加上不同的颜色，便于区分不同的区块，使用者可以定义不同括号类型和不同颜色
	10.open in browser——直接右键项目单击启动

Vue准备插件（正在整理学习，目前通过CSDN筛选出来几个）
	1.vue-resource
	2.http-server
	3.v-tap
	4.mint-ui
	5.vue-cordova
3.  vue与后端接口插件
	axios组件安装	//QF_Lemon直接同步至Gitee
	axios为Vue前端与后端进行交互的一个组件

移动端app开发步骤
	使用命令	npm run serve
	在网页端调取控制台F12，更改镜像为移动端即可
//  试验品apicloud
步骤：
<1>	登录apicloud网站，注册一个自己的账号，可以直接创建app模板，使用的技术多混合开发包含了Vue框架
<2>	详情配置b站网址：https://www.bilibili.com/video/BV1gE4114769?share_source=copy_pc

#### 使用说明

1.  vscode配置gitee：https://blog.csdn.net/qq_42661800/article/details/121986078
2.  分支管理：https://blog.csdn.net/qq_36398269/article/details/100984360?spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-100984360-blog-106428424-2%7Edefault%7ECTRLIST%7Edefault-1.pc_relevant_default&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-100984360-blog-106428424-2%7Edefault%7ECTRLIST%7Edefault-1.pc_relevant_default&utm_relevant_index=1%EF%BC%88%E5%88%87%E6%8D%A2%E5%88%86%E6%94%AF%EF%BC%89
3.  分支推送（先传到develope）：https://blog.csdn.net/qiaoqiaohong/article/details/123129344?spm=1001.2101.3001.6650.5&utm_medium=distribute.pc_relevant.none-task-blog-123129344-blog-78614632-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-5.pc_relevant_default&depth_1-utm_source=distribute.pc_relevant.none-task-blog-123129344-blog-78614632-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-5.pc_relevant_default&utm_relevant_index=10(%E6%8E%A8%E9%80%81%E5%88%B0%E5%85%B6%E4%BB%96%E5%88%86%E6%94%AF)

#### 简便推送方法
git add . git commit -m "" git pull git push

//这个方案是一个更快捷的方式(同时避免大家忘记pull) git add . & git commit -m "" & git pull & git push

#### 参与贡献

1. 前端：张纪鹏，孙满博，陈作恒，雷励行
2. 后端：张新宇，杨天傲，郝杰，徐铭辉，张海辰
3. EMO教师：田晓龙
4. 技术顾问：孟祥冰


#### 特技

1.  使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
2.  Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3.  你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4.  [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
5.  Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6.  Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)