$ npm install # 安装依赖

$ npm run create # 新增组件， 根据提示填写组件信息

$ npm run dev # 访问 http://localhost:4000/[组件名称]

$ npm run dev -- --component [COMPONENT NAME] # npm run dev -- --component button, 访问 http://localhost:4000

$ npm test # 全部测试

$ npm run test [component name] # 测试单个组件

$ git checkout -b [feature_xxx/fix_xxx] origin/dev

# 开发

$ git add --all
$ git commit -am "描述" # 描述参考【Commit规范】git cz
$ git pull --rebase origin dev

# 解决冲突

$ git push origin [feature_xxx/fix_xxx]

# 提交 PR 至 dev 分支, 指定相应人员 review, 根据反馈进一步修改提交

$ git checkout dev
$ git pull

├── build              构建脚本
├── config             构建环境配置
├── test               测试配置
├── components         组件代码
    ├── _style         通用样式，图标
    ├── _util          通用工具方法
    ├── button         组件目录
        ├── demo       组件示例
        ├── test       组件单元测试用例
        ├── index.vue  组件核心代码
        ├── ...        组件其他辅助代码或子组件代码
        ├── README.md  组件说明文档
    ├── ...
├── examples           组件库示例
├── site               组件库文档站点
├── ...

<template>
  <!-- 根元素以mfe-[组件名]作为类名 -->
  <!-- 多个动态属性需分为多行 -->
  <!-- 统一使用指令缩写 : @ -->
  <div
    class="md-button"
    :class="[type]"
  >
    <!-- 其他组件名称和prop属性使用kebab-case，且避免使用自闭合 -->
    <my-component greeting-text="hi"></my-component>

    <!-- 尽量将v-for/v-if提取到单独template中 -->
    <!-- v-for 必须增加 key -->
    <template v-if="foo">
      Hello A
    <template>
    <template v-else>
      Hello B
    <template>
  </div>
</template>

<script>
import MyComponent from '../my-component'

// options须严格按照如下顺序，其他可参考vue-style-guide
export default {
  // 必须以"md-[组件名]"作为前缀，避免与html元素冲突
  name: 'md-button',

  components: {
    [MyComponent.name]: MyComponent
  },

  // props须以明细方式书写
  // 统一采用事件触发，避免使用props传入回调方法
  props: {
    // js中prop属性需用驼峰
    greetingText: {
      type: String,
      default: 'primary'
    }
  },

  // data必须为函数
  data () {
    return {

    }
  },

  computed: {

  },

  watch: {
  },

  // LiftCircle Hook,
  /*
  beforeCreate
  created
  beforeMount
  mounted
  beforeUpdate
  updated
  activated
  deactivated
  beforeDestroy
  destroyed
  errorCaptured
   */

  methods: {
    // 私有方法以'$_'开头
    $_privateMethod () {

    },

    // 监听事件方法以'$_on'开头，如 $_onButtonClick
    $_onSthEvent (event) {
      // 事件名称无需增加on
      this.$emit('active', 'hello')
    },

    // 对外暴露方法
    publicMethod () {

    }
  }
}
</script>

<style lang="stylus" scoped>
  .md-button
    xxx
</style>

[TYPE](SCOPE):DESCRIPTION#[ISSUE]  # 如 feat(button):add type 'ghost' for form usage #1234