第一个vue app混合开发项目的简单总结前言有机会参与宁波银行一期项目开发和维护的工作经历和第一次真正意义上使用vu

前言

有机会参与某x银行一期项目开发和维护的工作经历和第一次真正意义上使用vue开发开发app的工作经历和经验

主体

项目搭建和打包

项目的搭建是在我进去前就已经完成的，我看了下项目的结构目录，使用的是vue-cli 4.x的方式进行开发的，由于是内网开发(大家都懂的),没办法截图相关的页面，一些调用手机原生系统的功能由Native同事开发，如键盘组件，分享组件，标题组件等只能以文字的方式展示给大家了(大佬可以略过哦...)

项目使用的一些流程(使用的开发工具及框架,ui库等)

vue.js前端框架:vue.js
vue.js的移动端UI框架:vant ui
vue.js全家桶之一的状态管理器:vuex
vue.js全家桶之一的路由管理器:vue-router
vue.js全家桶之一的开发的标准工具:vue-cli
运行在服务端的 JavaScriptnode.js
npm包管理器npm
yarn包管理器yarn<推荐使用这个>
前端开发工具ide(vscode和webstorm和HBuilder X)<看个人喜爱使用哪一个开发工具开发的>
git开源的分布式版本控制系统git
一个基于 JavaScript 的开源可视化图表库echarts
JavaScript 日期处理类库momentjs
给 CSS 加点料less
google浏览器google 第71个版本

项目目录结构(只能截本人自己的项目，项目结构类同)

QQ截图20210427111457.png

components文件夹中将组件分为共用的一些组件,如list组件，没有复杂的逻辑
directives文件夹中主要是一些全局性的自定义指令js逻辑文件
style文件夹中主要是放一些全局性的样式定义文件
store文件夹中是全局的状态
utils文件夹中是公用的工具函数
router文件夹中是路由管理文件
api文件夹中是全部接口管理文件
views文件夹是页面展示vue文件

使用git一些常用命令

1. git status [<options>…] [--] [<pathspec>…]命令用于显示工作目录和暂存区的状态。使用此命令能看到那些修改被暂存到了, 哪些没有, 哪些文件没有被Git tracked到。git status不显示已经commit到项目历史中去的信息。
2. git log [<options>] [<since>..<until>] [[--] <path>...] 用于查询版本的历史
3. git stash 保存当前工作进度，会把暂存区和工作区的改动保存起来
4. git stash pop恢复最新的进度到工作区
5. git checkout [-q] [-f] [-m] [<branch>] 命令用于切换分支或恢复工作树文件
6. git switch <branchName>  切换到已经存在的一个分支
7. git add .  命令可将该文件添加到暂存区。
8. git pull <远程主机名> <远程分支名>:<本地分支名> 用于从远程获取代码并合并本地的版本
9. git push <远程主机名> <本地分支名>:<远程分支名> 用于从将本地的分支版本上传到远程并合并
10. git commit -m [message] 将暂存区内容添加到本地仓库中