One, foreword

  • 1. Git is used to submit code

    • git add .
    • Git commit -m
    • git push origin master

  • 2. Using the traditional way to commit git code is the result

  • 3. This approach has several drawbacks

    • The longer you don’t know what you’re submitting
    • The submitted code is not managed by category
    • It is not convenient to find certain changes

  • 4. The most widely used specification for these issues is the Angular team; A vim editor will pop up at git commit time to edit a template type of commit information in the following format:

    <type>(<scope>):<subject> <BlLANK_LINE> <? body> <BLANK_LINE> <? footer>Copy the code
    • The first action required: mainly [submission type (scope of influence): brief description]
    • bodyFor a detailed description, not personally
    • The footer is changed or closed for destructive purposesissues

  • 5. Use the format of the code submitted after the specification

Two, use mode

  • 1. Installation package

    npm i -D commitlint-config-cz  cz-customizable
npm i -D @commitlint/cli @commitlint/config-conventional
npm i -D commitizen commitlint-config-cz
Copy the code

  • 2. Create the. Cz-config. js file in the root directory of the project

    module.exports = {
  types: [{value: 'init'.name: 'Init: Initial commit' },
    { value: 'feat'.name: 'Feat: Add New Features' },
    { value: 'fix'.name: 'fix: fix bugs' },
    { value: 'improvement'.name: 'Improvement: Improvements to current features' },
    { value: 'docs'.name: 'docs: Modify document ' },
    { value: 'style'.name: 'style: Style changes do not affect logic ' },
    { value: 'refactor'.name: 'refactor: code refactoring (code changes that neither fix bugs nor add features)' },
    { value: 'perf'.name: 'PERF: Code Refactoring (code changes that improve performance)' },
    { value: 'test'.name: 'test: Add missing tests or modify existing tests' },
    { value: 'build'.name: 'Build: Changes that affect build system or external dependencies (e.g. scope :gulp, BROCCOLI, NPM)' },
    { value: 'ci'.name: 'CI: Changes to CI profiles and scripts (sample range :Travis, Circle, BrowserStack, SauceLabs)' },
    { value: 'chore'.name: 'chore: Does not modify SRC or other changes to the test file ' },
    { value: 'revert'.name: 'Revert: Version Rollback' },
    { value: 'ui'.name: 'update UI: UI' },
    { value: 'release'.name: 'released release: },
    { value: 'deploy'.name: 'the deploy: deploy' },
    { value: 'chore'.name: 'chore: Changing the Configuration File ' },
    { value: 'add'.name: 'Add: Add dependencies' },
    { value: 'minus'.name: 'minus: version rollback ' },
    { value: 'del'.name: 'del: Delete code/file '}].scopes: [].messages: {
    type: 'Select change type :\n'.scope: 'Scope of change :\n'.// If allowCustomscopes are true, use them
    customScope: 'Scope of this change (such as component or file name)'.subject: 'Brief description :'.body: 'described in detail. The use of "|" line:'.breaking: 'List of changing files :'.footer: 'List of closed issues. E.g.: #31, #34:'.confirmCommit: 'Confirm submission? '
  },
  allowCustomScopes: true.allowBreakingChanges: ["feat"."fix"]};Copy the code

  • 3. Create commitlint.config.js in the root directory of the project

    module.exports = {
  extends: [
    '@commitlint/config-conventional'.'cz'].rules: {
    // Header 
    'header-max-length': [2.'always'.200]./ / < type > enumeration
    'type-enum': [2.'always'['init'.'feat'.'fix'.'improvement'.'docs'.'style'.'refactor'.'perf'.'test'.'build'.'ci'.'chore'.'revert'.'ui'.'release'.'deploy'.'chore'.'add'.'minus'.'del',]],// 
        
          cannot be empty
        
    'type-empty': [2.'never'].// 
        
          in lowercase format
        
    'type-case': [2.'always'.'lower-case'].// 
        
          cannot be empty
        
    'scope-empty': [2.'never'].// 
        
          in lowercase format
        
    'scope-case': [2.'always'.'lower-case'].// 
        
          cannot be empty
        
    'subject-empty': [2.'never']./ / < subject > in. For closing mark
    'subject-full-stop': [2.'never'.'. ']./ / < subject > format
    / / optional value
    // 'lower-case' lowercase lowercase
    // 'upper-case' UPPERCASE
    // 'camel-case' camelCase
    // 'kebab-case' short line kebab-case
    // 'pascal-case' PascalCase
    // 'sentence-case' uppercase sentence case
    // 'snake-case' underline snake_case
    // 'start-case' uppercase all letters start-case
    'subject-case': [2.'never'[]],//  starts with a blank line
    'body-leading-blank': [1.'always'].// 
        
    
          starts with a blank line
        
    
    'footer-leading-blank': [1.'always']}}Copy the code

  • 4. Add to package.json

    {... "config": { "commitizen": { "path": "node_modules/cz-customizable" } } }Copy the code

  • 5. Check commit message with Git hook to prevent you from committing code that doesn’t conform to the specification

    npm install husky -D
Copy the code

  • Configure git hook hook functions in package.json

    {... "husky": { "hooks": { "commit-msg": "commitlint -e $GIT_PARAMS" } }, }Copy the code

  • 7. Directly configure the command mode in package.json to commit

    {
  "scripts": {
    "commit": "./node_modules/cz-customizable/standalone.js"}},Copy the code

  • 8. The way the code is submitted

    git add .
npm run commit
git push origin master
Copy the code