vue项目架构

一、工程说明：

1.代码git仓库地址：git@gitlab.*****.git。

2.目录结构：

1>.index.html 为build打包发布网页入口；

2>.lieda文件夹代码项目工程目录；

3>.static为build打包发布网页入口访问资源；

注意：不是发布勿动index.html和static文件，勿在该层级目录下引入任何资源

3.开发打开leida项目工程进行开发。

4.git中test分支为测试环境；master为线上环境分支；

二、工程注意事项：

1.拉下分支更新资源文件：cnpm install

2.接入第三方库（在package.json—>dependencies中添加可省去此步骤）：

1>.Mint-ui H5开发快速集成组建；

2>.base64-js-codec加密；

3>.fastclick双击事件（地址：http://www.cnblogs.com/yexiaochai/p/3442220.html）；

4>.font-awesome一套绝佳的图标字体库和css框架；

5>.js-cookie缓存；

6>. Lodash封装了诸多对字符串、数组、对象等常见数据类型的处理函数;

7>.normalize.css让所有的浏览器上对于未定义的样式浏览效果达到一致;

8>.promise异步操作，有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和 Rejected（已失败）;

9>.store.js轻松实现本地缓存（地址：http://www.cnblogs.com/lhb25/p/store-js-for-localstorage.html）；

10>.vue-router路由跳转；

11>.animate.css动画；

12>.vue；

三、工程目录结构：

1.src问开发中文件目录，

下：

apis文件夹（所有的网络请求文件）

—>根据不同需求功能建立不同的文件夹例如：advert文件夹；

—>utils文件夹网络底层请求封装；

assets文件夹：放图片资源，

—>下根据不同的页面新建不同的文件夹再放入资源图片；

components文件夹：公用封装组建，

—>根据功能划分新建功能文件夹然后新建组建；

filters文件夹：处理业务显示js文件，例如（处理职位类型，公司规模，时间显示的js文件）：

export let genderRequired = function(id){

if(id==0){

return "不限"

}else if(id==1){

return "男士优先"

}else if(id==2){

return "女士优先"

}else{

return "";

}

}

routers：路由配置文件；

views：页面代码文件

—>根据不同的业务建立文件夹!

styles：不同的css样式封装；

四、打包发布流程；

1.测试域名为：lie*****.com 对应的分支为test；

2.线上域名为：暂时没配置  对应的分支为master；

3.npm run build 等待生成dist文件（dist文件为打包之后的文件资源包）；

4.替换一级目录下的index.html文件和static文件夹；

5.上传打包后代码到git上test分支；

6.进入ci.*****.com网页发布 —>前端发布（测试环境）—>***.h5项目—>立即构建