工作中总结前端开发流程–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


相关推荐

  • Qt面试题(二)

    Qt面试题(二)QT理论试题1以下关于QT的描述正确的是a.是一个不跨平台的C++图形用户界面b.由挪威TrollTech公司出品c.只支持Unix、Linuxd.QTAPI和开发工具对所支持的平台是不一致的2以下关于QT的描述不正确的是a.QT支持2D图形渲染b.QT支持3D图形渲染c.QT支持OpenGL d.QT不支持XML…

    2022年6月25日
    40
  • 单链表之插入结点

    单链表之插入结点

    2021年8月25日
    65
  • Python爬取美女图片 爬虫基础

    Python爬取美女图片 爬虫基础Python爬取美女图片爬虫基础简述实现思路关键代码文件下载爬虫代码成果简述作为一个考研狗,每天除了日复一日的复习外,偶尔也想给自己寻找一些生活的小乐趣,今天突然想到了自己曾经稍微接触的爬虫,想看看可以爬取些图片放到电脑上,就花了些时间改了改之前的爬虫代码,爬取了一部分照片先量一下战绩吧。照片不多但也算是自己的一次爬虫小经验。实现思路爬虫的网页很简单,照片真实路径都在页面中直接可以拿到主要流程就是先进入照片浏览的主页,每个照片的主页都会链接几个照片页面,像下面这样,每个图片都会链接一个网页

    2022年6月26日
    29
  • RecyclerView剖析

    RecyclerView剖析本文将从 RecyclerView 实现原理并结合源码详细分析这个强大的控件

    2026年3月19日
    2
  • linux更改用户名字_linux修改用户id

    linux更改用户名字_linux修改用户idlinux更改用户名的方法是:1、以root身份登录,然后使用下列命令进行修改。“usermod-lNewUser-d/home/NewUser-mOldUser”、“usermod-lalao-d/home/alao-mtom”。2、修改用户名,修改登录后使用的路径,修改登录名称的同时将目录名称一同修改。…

    2026年1月19日
    4
  • gromacs 安装_分子模拟软件 gromacs 安装流程

    gromacs 安装_分子模拟软件 gromacs 安装流程分子模拟软件gromacs安装流程(1)tar-zxvffftw-3.1.2.tar.gztar–zxvfgromacs-3.3.1.tar.gztar-zxvflam-7.1.3.tar.gz(2)cdlam-7.1.3./configure–prefix=/home/lam-7.1.3–without-fc–with-rsh=”ssh-x”makemakeins…

    2022年5月26日
    83

发表回复

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

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