# 前端 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)
陈列柜 →