# 前端 Frontend
# 能力输出
- 各类型网站,包含但不限于以下类型
- 管理平台
- CMS 站点
- 企业门户综合网站
- 服务类型网站
- 设备嵌入网页
- 微信小程序
- 支持全平台(Windows、Mac、Linux)的桌面客户端,以
Windows
环境为例,客户端程序以exe
格式的可执行文件形式存在,不需要依赖浏览器运行,例如 QQ、Microsoft Office 等一系列可直接运行的桌面客户端
网站可根据需求针对 desktop
、tablet
、mobile
等不同尺寸设备进行适配
# 项目构建及发布
项目工作分支根据 Git 分支使用规范 执行代码环境管理
# 构建网站
各类型网站、设备嵌入式网页等内容的构建及发布
# 开发环境
开发环境使用本地环境进行构建及运行项目
# 测试环境
将代码合并至 test
分支后,持续集成平台将自动进行打包、成果交付以及服务自动更新,构建任务完成后,应告知相关人员进行内容测试工作
需注意自动发布需要一定执行及构建的时间,应尽可能不要在短时间内连续推送内容至分支,以导致构建任务被连续触发;若有短时间内再次构建的需求,也应在构建任务完成后,再次推送代码
流程示意图
# 生产环境
特别关注
生产环境内容发布须严格按照计划安排及发布流程执行
执行发布生产环境流程
- 测试人员确认当前版本已通过测试
- 项目负责人/项管根据计划决定更新时间
- 在开发分支(dev)执行构建前自动化测试
- ESLint 语法检查扫描
- 单元测试
- 端对端测试
- 项目负责人/项管宣布可以开始上线时,将开发分支
dev
的代码合并至master
生产环境分支 - 通知运维人员更新生产环境
- 更新成功后,在项目相应的公司项目官方群组公告通知更新成功
- 测试人员验证生产环境
- 生产环境验证通过后,为
master
分支设置当前版本tag
,标题为当前版本号,内容则填写当前版本功能的简要内容。如果一个项目有多个子模块,那么标题的版本号应增加相应模块名称,以公司的素+管理平台项目为例,销售导航 1.2.0
版本生产环境发布完成后,tag 可设置为sale-navigate-1.2.0
流程示意图
# 构建微信小程序
微信小程序各版本发布流程说明
预览版
- 设置环境参数为开发版
- 将开发完成的代码上传至微信小程序平台
- 通过扫描预览版二维码进行试用
线上版
- 测试小组确认当前版本已通过测试
- 项目负责人根据计划决定更新时间
- 设置环境参数为线上版
- 上传代码至微信小程序平台
- 进入微信公众平台,在版本管理中将当前 体验版 提交为 线上版
- 等待微信平台审核
- 微信平台审核通过,并会在微信中通知相关人员
- 进入微信公众平台,将审核通过的版本,发布为 线上版
# 浏览器支持情况
# 浏览器及版本要求
IE / Edge | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|
IE10, IE11, Edge | Firefox 18+ | Chrome 49+ | Safari 10+ | Opera 36+ |
后续的技术版本升级后,仅对 IE11 进行兼容性支持
# 屏幕分辨率要求
最小兼容 1366 X 768
分辨率
# 项目部署需求
- nginx(gzip)
# 项目技术组成
管理平台
- vue2
- vue-router
- vuex
- axios
- element-ui
- bootstrap 5(仅 CSS)
网页开放平台(专项提供移动端 WebView 嵌入、独立页提供)
- vue2
- vue-router
- axios
- bootstrap 5(仅 CSS)
单元测试
- vue-test-utils
- mocha
- cypress
- chai
小程序
- 微信小程序原生方式
# 代码版本控制位置
前端团队代码使用位置:frontend (opens new window)
陈列柜 →