# github 分支创建规则以及使用

## 1.添加项目
  - git clone url 到本地添加项目文件
  - 目前分支共三种：main主分支，develop公共开发分支，feature_name个人开发分支(后期会有测试分支)
  - 进入本地 git pull -p 将所有远程分支拉取到本地
## 2.开发分支创建
  - git branch -all       --- 查看所有分支包括本地和远程。
  - git checkout -b 分支名 --- 在本地创建并且跳到该分支
  - git checkout  分支名   --- 切换分支
## 3.分支代码提交
  - 将代码从工作区【添加】至暂存区       git add . (全部) / git add 文件路径 (部分)
  - 将代码从暂存区【提交】至本地分支     git commit -m "提交信息" 
  - 将本地分支代码【推送】至远程分支     git push 
  - 新建的本地分支第一次推送需要 git push --set-upstream origin feature_name,这样远程仓库就会出现你的分支
  - 推送本地分支代码和合并代码之前必须 git pull 拉取远程分支代码，有代码冲突必须先解决冲突才能进行推送或合并操作
  - feature分支与develop分支合并前，请一定需要把feature的commit合并，再与develop进行merge
  
****

# 开发规范类：
 - 参考链接：
   > [https://codeguide.bootcss.com/#html-attribute-order]

## import 导入规范

- 1.npm 引入的相关包
- 2.样式文件(.scss/.css)
- 3.js功能模块(.js)
- 4.组件模板(.art)
- 5.图标 静态资源类(.svg/.eot/.ttf/.woff)



## HTML开发规范
 - 1.标签内属性书写位置优先级 （id > className > 事件属性 > src  > alt > style > 其他，单字符属性放到最后 ）
 - 2.尽量不要写行内样式


## CSS开发规范：
 工程化组件化思想，每个样式文件对应各自的js代码模块，其他放入到公共部分。
### 一.样式书写先后顺序规范
        优先级从小到大，位置属性 > 盒子模型 > 文字系列 > 背景 > 其他
- 1.位置属性（positon > display > float > z-index > top > right > left > bottom）
- 2.盒子模型大小（box-sizing > width > height > padding > border > margin ）
- 3.文字系列 （text-align > font > line-height > color >其他）
- 4.背景 （background > 其他）
- 5.其他（animation transition等）

### 二.缩写规范
 - 1.padding,boder,margin,font等等采用缩写.-->前三个尽量合起来写，四个参数 三个参数 两个参数等缩写
 - 2.小数点形式请采用缩写，例如 0.8 ---> .8
 - 3.RGB 等颜色能采用缩写的也要采用缩写 例如：rgb(255,255,255) ---> #fff
 - 4.长命名样式名称使用小驼峰。 例如：moduleXxx 或者使用横线 mfunsPlayer-module-xxx
 - 5.样式选择器尽量使用class选择器

### 三.常用命名规则
- 1.使用英文命名不要使用拼音 一律小写，不要使用横线下划线等  
    例：  
     主体：main      头：header      内容：content/container     尾：footer  
     侧栏：sidebar   包围：wrap      位置：left right center    标志：logo   
     栏目 ：banner   标签：tag       列表：list             提示：tips        标题：title
         
- 2.常见样式命名：  
    例：  
    主目录 index.css  模块 module.css   基本的 base.css  布局类  layout.css  
    主题 theme.css 等等     

### 四.注释的写法
 - 切勿使用/* */，因为会生成在css文件中  样式中添加中文注释如果报错，请在头部加入----> @charset "utf-8"; 指定编码格式


## JS开发规范：
### 一.语法规范
 - 1.严格准守eslint
 - 2.尽量使用es6及以上语法
 - 3.使用小驼峰命名变量/函数/方法

### 二.代码书写规范 
 - 尽量不使用var命名变量和常量，改用let和const
 - 表达式执行以及赋值 请使用|| && 或者三元运算符  
 ```js
    1 === 1 && a.b[(2 < 1 || 1 === 1)?"add":"remove"]()
```

 - 引用对象变量尽量使用解构赋值   
 ```js
  const obj = {a:{d:{e:1}},b:2,c:3}
  const {a:{d:{e}},b:B,c} = obj
  //此时声明e ,B ,c三个常量,其中e为三次解构常量，B为b的一次解构常量别名，c为一次解构常量
  console.log(e,B,c) //1,2,3
```
  - 条件分支   
 ```js
 // 单行if语句请写在一行 
   if( 1 === 1) console.log(1);
  //如果一个方法中执行if-else语句可简写
  function test(bol = true) {if(bol) return 1;else return 0}
```

  - 使用es6语法对数组进行遍历、映射、增删改等操作
  - 监听鼠标移动、滚动事件时，回调函数需要进行防抖或节流处理，避免频繁调用
  - class类方法内部使用箭头函数，避免this指针丢失

****
 
# 模块规范

## 一.模块负责人
<details>
<summary>展开查看</summary>
<pre><code>
├── mfunsPlayer
├── Owner:rudiusu
├── src
│   ├── Owner: rudiusu
│   ├── js
|   ├── Owner: rudiusu
|   |   ├── advancedDanmaku
|   |   │   └── Owner: minteea
|   |   ├── api
|   |   │   └── Owner: rudiusu
|   |   ├── bar
|   |   │   └── Owner: rudiusu
|   |   ├── components
|   |   │   └── Owner: minteea
|   |   ├── contextmenu
|   |   │   └── Owner: rudiusu
|   |   ├── controller
|   |   |   └── Owner: rudiusu
|   |   ├── danmaku
|   |   |   └── Owner: rudiusu
|   |   ├── danmakuAuxiliary
|   |   |   └── Owner: minteea
|   |   ├── events
|   |   |   └── Owner: rudiusu,minteea
|   |   ├── fullscreen
|   |   |   └── Owner: rudiusu
|   |   ├── highEnergy
|   |   |   └── Owner: rudiusu
|   |   ├── hotKey
|   |   |   └── Owner: rudiusu
|   |   ├── index
|   |   |   └── Owner: rudiusu
|   |   ├── info-panel
|   |   |   └── Owner: rudiusu
|   |   ├── options
|   |   |   └── Owner: rudiusu
|   |   ├── player
|   |   |   └── Owner: rudiusu,minteea
|   |   ├── template
|   |   |   └── Owner: rudiusu,minteea
|   |   ├── thumbnails
|   |   |   └── Owner: rudiusu
|   |   ├── timer
|   |   |   └── Owner: rudiusu
|   |   ├── utils
|   |   |   └── Owner: rudiusu,minteea
|   |   └── videoColor
|   |       └── Owner: rudiusu
|   ├── css
│   ├── Owner: rudiusu
|   |   ├── components
|   |   │   └── Owner: minteea
|   |   ├── controller
|   |   │   └── Owner: rudiusu
|   |   ├── danmaku
|   |   │   └── Owner: rudiusu
|   |   ├── danmakuAuxiliary
|   |   │   └── Owner: minteea
|   |   ├── font-icon
|   |   │   └── Owner: minteea
|   |   ├── footBar
|   |   │   └── Owner: rudiusu
|   |   ├── fullscreen
|   |   │   └── Owner: rudiusu
|   |   ├── index
|   |   │   └── Owner: rudiusu,minteea
|   |   ├── loader
|   |   │   └── Owner: rudiusu
|   |   ├── menu
|   |   │   └── Owner: rudiusu
|   |   ├── modal
|   |   │   └── Owner: rudiusu
|   |   ├── panel
|   |   │   └── Owner: rudiusu
|   |   ├── player
|   |   │   └── Owner: rudiusu
|   |   ├── theme
|   |   │   └── Owner: minteea
|   |   └── video
|   |       └── Owner: rudiusu
|   |
|   ├── icon
|   └── Owner: rudiusu
|       └── fonts        
|           └── Owner: minteea
|
└── template
    ├── Owner: rudiusu
    ├── danmakuAuxiliary
    │   └── Owner: minteea
    ├── danmakuReportModal
    │   └── Owner: rudiusu
    ├── player
    │   └── Owner: rudiusu,minteea
    ├── slider-vertical
    │   └── Owner: minteea
    ├── slider
    │   └── Owner: minteea
    ├── video
    |   └── Owner: rudiusu
    └── videoColorModal
        └── Owner: rudiusu
</code></pre>
</details>

## 二.模块开发守则
 - 1.项目各个模块由各自的Owner负责，一般情况不得变动
 - 2.若某个模块出现问题请直接联系Owner，非Owner不得私自改动
 - 3.当出现某个模块需要多名开发组成员共同开发时，请划分自己的代码区域，不要改动其他小伙伴的代码，更不要随意更改整体模块代码结构
 - 4.项目Owner对项目内模块有最终决定权