1.开发规范
- 编码规范，英文版地址
- 遵循vue风格指南
- 完全了解业务的前提下再进行开发
- 开发前编写开发文档，开发中严格遵循开发文档要求
- 统一采用Eslint规范代码风格
- 将面向对象思想、设计模式贯穿到开发中
- 常用组件要进行封装
1.1插件使用规范
- 不要引入不必要的插件
- 确实需要引入时，考虑按需引入
- 尽量不要使用JQuery等需要操作DOM来在更新状态的插件
- 使用vuex状态管理时需要考虑必要性：不要为了使用vuex而使用vuex
- 尽量不要自己造轮子
1.2.组件使用规范
字体
统一使用微软雅黑
Icon
优先使用字体图标，（不能满足需求时，采用切图）
image
- 考虑是否需要增加onerror状态下的显示状态
- 考虑适配问题
颜色
考虑是否需要在选中，激活状态下增加区分效果
Button
- 有查询等网络请求操作时，使用disabled属性，避免重复点击
- 根据用户习惯，弹窗footer中“确定”按钮在“取消”左侧
- 考虑是否需要增加必要的图标，使按钮更形象
Input输入框
- 类型限制，（数字类型（只允许输入数字）、金额类型（小数位控制））
- 长度限制
- 是否需要 clearable
- 是否需要自动获取焦点（包含其他操作结束后，焦点会自动回到输入框）
- 是否需要选中并覆盖输入框中的值
- 是否需要表单验证、正则验证
- 多个输入框，是否需要支持，通过键盘操作焦点上下左右切换
- 是否需要支持键盘操作，比如：Enter键，作为确认操作
- 绑定model是否需要增加修饰符（trim、number）限制
★★★★★ 除了登录时候需要记住密码，其他情况禁止出现保存密码或者更新密码弹窗，非密码类型输入框禁止被自动填充。
Select 选择器
- 只有一个候选项时，直接展示到选项中
- 考虑是否需要支持clearable
- 有查询等网络请求操作时，使用disabled属性，禁止操作
Table表格
- 数字类（数量、比例）、金额类的，均居右展示
- 表格中文字较长的，hover时提示文字显示全
选择器 （时间、日期选择器）
- 考虑是否需要禁止输入
- 考虑是否需要clearable
Dialog
- 增加宽度高度限制，支持不同分别率
- 考虑是否会影响父布局
- 考虑什么时候进行关闭（点遮罩层、键盘ESC）
- 异常状态下，弹窗是否会自动关闭
提示
- 给与必要的提示
- 提示的正确性、严谨性（不要有错别字，要易于理解）
- 尊重用户习惯，比如：弹窗footer左侧确定、右侧取消（关闭）
tab
关闭页签时候，是否需要提示（增强严谨性）
NavMenu 导航菜单
Carousel 走马灯
- 考虑只有一个轮播页面时候的展示形式
- 考虑轮播上的事件与轮播是否对应
Backtop 回到顶部
根据实际情况，考虑是否需要回到顶部或指定位置
Affix
根据实际情况，确定是否需要吸附效果，并且考虑兼容性问题
2.项目打包配置
- 打包后的项目，禁止在控制台输出调试信息，可以统一使用插件terser-webpack-plugin
- 代码打包压缩，可以统一使用插件 compression-webpack-plugin
后台需要开启gzip
3.常见问题
3.1 页面缓存问题
根据实际项目需要，确定是否需要缓存页面数据。对于多页签页面，一般需要缓存每个页面的数据。
3.2 vue项目缓存问题
1.index.html中禁止缓存
<meta http-equiv="Expires" CONTENT="0">
<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="Pragma" CONTENT="no-cache">
2.引入的静态js后加时间戳
<script src="/static/api.js?v=<%= new Date().getTime() %>"></script>
3.提示用户，版本更新，自己退出重新登录（没有办法的办法）,进行刷新。获取最新项目
this.$router.replace({path: `/login?v=${new Date().getTime()}`})
location.replace(location.href)
4.nginx中进行配置
expires -1s;
add_header Cache-Control no-cache;
add_header Cache-Control private;
3.3 其他问题
- 浏览器兼容问题，对应支持es语法的浏览器，需要特别关注IE11样式、功能是否有异常
4.其他
4.1插件推荐
- 导出excel
- Lodop打印插件如何在vue项目中使用lodop打印插件
- 百度Echarts Echarts
- 富文本编辑器 vue-quill-editor wangEditor
