工作中总结前端开发流程–vue项目

工作中总结前端开发流程–vue项目

开发流程

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

开发

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 Module
    CSS 模块化:less、sass、stylus、postCSS、css module
  • 组件化
    采用组件化的编程思想,处理 UI 层
  • 静态资源管理

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

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

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

测试

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

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

部署

webpack进行打包后,丢到服务器上,项目上线。
当然,上线前,要进行性能优化,例如配置缓存,静态资源CDN部署。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/101096.html原文链接:https://javaforall.net

(0)
上一篇 2021年7月1日 上午8:00
下一篇 2021年7月1日 上午9:00


相关推荐

  • xshell如何激活_xftp6使用教程

    xshell如何激活_xftp6使用教程市面上连接服务器的客户端有很多,有免费的,也有收费的。有国产的也有非国产的。每个人使用的都不一样。很多也使用过,比如putty免费的,但是在我使用看来,使用一会就卡顿住了,最后就是需要重新连接,怎么用都不是很方便,最后还是的使用回来xshell和xftp。下面就来演示下如何安装xshell和xftp。首先是下载xshell和xftp的软件安装包。其实下载这个安装包是非常简单的,但是不简单的是如何下载一个真的能用的安装包。其次就是安装了。安装其实也是非常的简单的。下一步,下一步就可以完成.

    2025年10月9日
    7
  • PyCharm怎么来更新pip

    PyCharm怎么来更新pip1 首先 在 PyCharm 中打开一个 Python 项目 PyCharm 已经为此 Python 项目创建了虚拟 Python 环境 2 在下方切换到 Terminal 以管理这个小型虚拟 Python 环境 3 在 Terminal 中使用命令 python mpipinstallu 就可以安装 pip 最新版本 4 如果安装失败 这一般是因为服务器连接超时 因为 pip 源在国外 所以连起来比较慢 可以改用国内的源 使用下面的代码 python mpipinstallu

    2026年3月20日
    3
  • js onmousemove使用注意:进入onmousemove不代表移动鼠标

    js onmousemove使用注意:进入onmousemove不代表移动鼠标判断鼠标是进行的移动事件还是点击事件 onmousemove

    2026年3月26日
    2
  • Cassandra SizeTieredCompaction策略解析

    Cassandra SizeTieredCompaction策略解析

    2021年8月18日
    60
  • 每天学点GDB 3

    每天学点GDB 3

    2021年8月22日
    59
  • oracle协议适配器错误tns,ORA-12560: TNS: 协议适配器错误 常见原因

    oracle协议适配器错误tns,ORA-12560: TNS: 协议适配器错误 常见原因或者报以下错误(Listenerrefusedtheconnectionwiththefollowingerror:ORA-12514,TNS:listenerdoesnotcurrentlyknowofservicerequestedinconnectdescriptorTheConnectiondescriptorusedbythecli…

    2022年6月18日
    41

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号