超详细为vue项目添加代码提交规范【实战】

为新项目添加代码提交工具

在package.json中添加如下命令

"scripts": {
  "lint-fix": "eslint --fix --ext .js,.vue src",
  "commit": "git add . && git-cz",
  "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
  "release": "standard-version"
},
"repository": {
  "type": "git",
  "url": ""// remote地址
},
"config": {
  "commitizen": {
    "path": "node_modules/cz-customizable"
  }
}

安装如下依赖：

npm install -D  @commitlint/cli @commitlint/config-conventional commitizen conventional-changelog-cli cz-customizable standard-version

在根目录添加 .cz-config.js文件

module.exports = {
  types: [
    {
      value: 'WIP',
      name: 'WIP: 工作中的提交'
    },
    {
      value: 'feat',
      name: 'feat: 新特性'
    },
    {
      value: 'fix',
      name: 'fix: 修补bug'
    },
    {
      value: 'merge',
      name: 'merge: 合并代码'
    },
    {
      value: 'docs',
      name: 'docs: 文档'
    },
    {
      value: 'refactor',
      name: 'refactor: 重构（代码优化，不影响功能）'
    },
    {
      value: 'test',
      name: 'test: 测试'
    },
    {
      value: 'chore',
      name: 'chore: 杂项 （构建工具、辅助工具的变动）'
    },
    {
      value: 'style',
      name: 'style: 代码风格调整 (如：空格，格式，分号等等)'
    },
    {
      value: 'pref',
      name: 'revert: 性能优化'
    },
    {
      value: 'revert',
      name: 'revert: 撤销提交'
    }
  ],

  messages: {
    type: '请选择本次提交的类型:',
    scope: '\n请设置本次提交的任务ID或范围 (可选，E.g.:#JGRW-123,router):',
    // used if allowCustomScopes is true
    customScope: '请设置本次提交的任务ID或范围 (可选，E.g.:#JGRW-123,router):',
    subject: '请设置当前提交的简短描述:\n',
    body: '请设置当前提交的详细描述(可选). 使用 "|" 换行:\n',
    breaking: '列出任意BREAKING CHANGES (可选):\n',
    footer: '列出完成的任务ID(可选，E.g.: #JGRW-123, #JGRW-234):\n',
    confirmCommit: '确认提交?'
  },

  scopes: [],
  allowCustomScopes: true,
  allowBreakingChanges: ['feat', 'fix'],

  // 限制subject长度
  subjectLimit: 100
}

在根目录添加.versionrc.js文件

module.exports = {
    "commitUrlFormat": "{{host}}/{{owner}}/{{repository}}/commit/{{hash}}",
    "issueUrlFormat": "http://jira.dev.ztosys.com/browse/{{hash}}",
    "types": [
      {"type": "feat", "section": "Features"},
      {"type": "fix", "section": "Bug Fixes"},
      {"type": "test", "section": "Tests", "hidden": true},
      {"type": "build", "section": "Build System", "hidden": true},
      {"type": "ci", "hidden":true}
    ]
  }

在根目录添加commitlint.config.js文件

module.exports = {
  extends: ['@commitlint/config-conventional'],
  rules: {
    'type-enum': [
      2,
      'always',
      [
        'WIP',
        'feat',
        'fix',
        'merge',
        'docs',
        'test',
        'chore',
        'refactor',
        'style',
        'perf',
        'revert'
      ]
    ],
    'type-case': [0],
    'type-empty': [0],
    'scope-empty': [0, 'never'],
    'scope-case': [0],
    'subject-full-stop': [0, 'never'],
    'subject-case': [0, 'never'],
    'header-max-length': [0, 'always', 72]
  }
}

到这里全部配置完成。 使用方法很简单

尝试运行

npm run commit

开始规范提交代码吧~