查看源

目录命名
- 能直观的感受当前目录文件的作用
- 以小驼峰方式命名
- 特殊缩写名称可大写开头
- - 根目录 - schoolHandle //学校管理 - environmentDetail //环境详情

页面命名

能直观的感受当前文件的作用
以小驼峰方式命名
有多页面功能重复时可忽略父文件夹名称
一个目录下页面过多时可使用二级目录分类但不得超过二级

- 根目录
    - powerlHandle //电源管理
		- roomList.vue //电源管理实训室列表
		- plateformList.vue //电源管理实训台列表
    - environmentHandle //环境管理
		- roomList.vue //环境管理实训室列表
		- plateformList.vue //环境管理实训台列表
    - consumableHandle //耗材管理
		-basic //耗材管理基础页面
			-goodsHandle.vue //耗材管理产品管理
			-warehouseHandle.vue //耗材管理仓库管理
		-form//耗材管理表单页面
			-apllyGet.vue //耗材管理申购表单
			-inStorage.vue //耗材管理入库表单

单独一页的功能为一个目录和index.vue组成

- 根目录
    - powerlHandle //电源管理
		- index.vue

组件命名
- 能直观的感受当前组件的用途
- 组件命名始终是多个单词的，避免跟html元素或标签冲突
- 要么大写开头，要么始终用横线链接
- - BaseButton.vue - BaseTable.vue - BaseIcon.vue
图片命名
- 图片文件夹一般遵从页面或者模块命名,如：login/）
- 图片不可随意命名，且严禁使用0，1，等数字直接命名图片。
- 图片命名可遵循：用途+描述，多个单词用下划线隔开，如：login_icon.png,pwd_icon.png
- 10k以下图片建议放置assets/img下（webpack打包时直接转为base64嵌入）
- 大图且不常更换的图片放置public/img下
- 可用css编写的样式严禁使用图片
- 国际化图片，后缀使用简体-cn,英文-en,繁体-tw
路由命名
- 普通路由(非动态多级)命名，可以直接使用页面组件的命名。
id class命名
- 首先根据内容命名，如：nav,header
- 内容中的子元素使用-链接，名称一律小写，如：card-item
- 修饰类（易变的）使用--链接，如：card-item--warning
- 若无内容，结合行为进行辅助，如：box-shawder
- 若为布局元素,结合内容与位置命名，如：news-left
- 不影响语义的情况下，可缩写，如：img-box,btn,
变量命名
- 变量命名：小驼峰命名
- 参数名：小驼峰命名
- 函数名：小驼峰命名
- 方法/属性名：小驼峰命名
- 类名开头大写
- 私有属性、变量和方法以下划线 _ 开头。
- 常量名：全部使用大写+下划线
- let loadingModules = {}; const HTML_ENTITY = {}; function stringFormat(theBells) {} function insertHTML(element, html) {} function Engine(options) {}
- 不使用单字母变量，不使用无意义字符如：aaa，使用缩写时缩写成人看得懂的东西 saveButton === saveBtn !== sb

目录命名

页面命名

组件命名

图片命名

路由命名

id class命名

变量命名

`id class`命名