博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
工作中总结前端开发流程--vue项目
阅读量:6695 次
发布时间:2019-06-25

本文共 840 字,大约阅读时间需要 2 分钟。

开发流程

需求 -> 原型 -> 开发 -> 测试 -> 上线

开发

1.版本控制

选用git进行版本控制。

  • 新建分支进行开发,master主线,code review后进行合并。
  • 利用分支,部署不同的上线版本

2.技术选型

  • 根据业务需求,选择合适的技术 -- vue-cli
  • 制定统一编码规范,便于团队协作和代码维护,例如eslint, tslint

3.环境配置

初始化项目完成后,提交代码到远程库。
为保持环境统一,推荐以下方式:

  • 需团队共享的 npm config 配置项
  • 使用 npm: >=5.1 版本, 保持 package-lock.json 文件默认开启配置
  • 提交 package.json, package-lock.json。package.json中,项目依赖semver为^X.Y.Z
  • 项目成员首次 clone 项目代码后,执行npm install 安装依赖包
  • node 版本约束

4.构建优化

根据实际项目,更改webpack配置。

5.目录结构

  • 模块化

    采用模块化的方式组织代码:

    JS 模块化:AMD、CommonJS、UMD、ES6 ModuleCSS 模块化:less、sass、stylus、postCSS、css module
  • 组件化
    采用组件化的编程思想,处理 UI 层
  • 静态资源管理

    1.非模块化资源2.模块化资源--与模块一起进行统一管理

开发结束后,一般也会经历以下几个过程:

1.需求变更,重新开发2.code review3.提交测试,修改bug单,回归测试

测试

1.SIT测试环境

测试环境,前后端分离,后台CORS,前台通过代理跨域。
最好采用source map方式,利于追踪bug。
一般测试通过,bug单清零,会转UAT测试。

2.UAT测试环境

用户验收测试,一般通过后,就准备部署上线。

部署

webpack进行打包后,丢到服务器上,项目上线。

当然,上线前,要进行性能优化,例如配置缓存,静态资源CDN部署。

转载地址:http://sqvoo.baihongyu.com/

你可能感兴趣的文章
以太网ip,tcp,udp数据包分析
查看>>
frame和iframe区别
查看>>
border ,background-attachment
查看>>
Algs4-1.5-quick-union
查看>>
noip2010普及组 接水问题分析
查看>>
流程控制
查看>>
PHP验证码无法显示
查看>>
k8s/02中文文档学习笔记
查看>>
网站平台架构演变史(三) - 数据库表的查询优化
查看>>
fastdfs 图片服务器 使用java端作为客户端上传图片
查看>>
步步为营 .NET 代码重构学习笔记 三、内联方法(Inline Method)
查看>>
前端地址大全
查看>>
DAY19-Django之model进阶
查看>>
从0移植uboot(六) _实现网络功能
查看>>
Linux命令——du
查看>>
Cube Stacking
查看>>
WPF中DataGrid的ComboBox的简单绑定方式(绝对简单)
查看>>
UIViewContentMode各类型效果
查看>>
转:开启nginx的gzip压缩的相关参数设置
查看>>
转:网站架构-从无到有
查看>>