Commit 메시지 사양

angular 사양의 경우 다음과 같은 형식이 지정됩니다.

type(scope): subject        # head   ，   type   subject   。
                            #   
72-character wrapped.       # body   。
                            #   
BREAKING CHANGE: msg.       # footer   。

여기에서:

헤드 부분

type(다음 7개의 ID만 허용):

feat: 새로운 기능(feature)

fix: 버그 수정

docs: 문서(documentation)

style: 형식(코드 운행의 변동에 영향을 주지 않음)

refactor: 재구성(즉 새로운 기능도, 버그를 수정하는 코드 변동도 아니다)

test: 테스트 증가

chore: 구축 과정 또는 보조 도구의 변동

：feat   fix commit는Change log에 나타납니다.
scope:
이번 제출의 영향 범위, 예를 들어 데이터 층, 제어 층, 보기 층 등은 여러 개를 *로 대체할 수 있으며 type 이후, 작은 괄호 안에 있어야 한다.
subject:
이번 제출의 간략한 설명은 type 이후의 사칭 이후의 빈칸 뒤에 마침표가 없어야 합니다.

body 섹션(선택)

이번에 제출한 상세한 설명은 변동설명, 변동이유 등을 포함하고 1인칭 현재시설명을 사용해야 한다.
head 부분과 빈 줄을 간격해야 하며 72가 넘는 문자마다 줄을 바꿔야 합니다.

foot 섹션(선택)

두 가지 상황 포함: 1.현재 코드는 이전 버전, BREAKING CHANGE 사칭 빈칸을 호환하지 않으며 변동 설명, 변동 이유와 이전 방법을 따릅니다.2. Issue, Closes #234를 닫습니다.
특수 상황: 현재commit는 이전의commit,revert 사칭 공백을 취소하고 취소할 commit의head를 사용합니다.

Commit 메시지 사양 구속 도구

프로젝트에 commitizen을 설치하려면 다음과 같이 하십시오.

npm i -D commitizen cz-conventional-changelog

프로젝트 루트 디렉터리에 생성합니다.czrc 파일:

{ "path": "cz-conventional-changelog" }

항목의 package를 수정합니다.json 파일:

"script":{
    "commit":"git-cz",
},
"config":{
    "commitizen":{
        "path":"node_modules/cz-conventional-changelog",
    },
},

이 때 프로젝트에서git cz나 npm run commit 명령을 사용하면git commit 명령을 대체할 수 있습니다. 제출할 때angular 규범의commit 메시지 편집 옵션을 자동으로 가져옵니다. 다음은cz-customizable를 사용하여 사용자 정의 규범을 실현할 것입니다.
프로젝트에 cz-customizable를 설치하려면 다음과 같이 하십시오.

npm i -D cz-customizable

항목 수정 중.czrc 파일:

{ "path": "cz-customizable" }

항목의 package를 수정합니다.json 파일:

"script":{
    "commit":"git-cz",
},
"config":{
    "commitizen":{
        "path":"node_modules/cz-customizable",
    },
},

프로젝트 루트 디렉터리에 생성합니다.cz-config.js 파일, 구성 항목은 다음과 같습니다.

type: {Array of Object}: 항목에 사용되는 type과 기본 설명입니다.

scopes: {Array of Strings}: 미리 설정된 항목에 사용할 선택 사항scope입니다.예를 들어 한 은행 시스템 프로젝트에서 ["acccounts", "payments"]를 사용한다.한 여행 응용 프로그램에서 ["bookings", "search", "profile"]를 사용합니다.

scopeOverrides: {Object where key contains a Array of String}: 특정 제출 형식의 역할 영역을 다시 쓰려면 이 방법을 사용하십시오.예를 들어 "fix"형식이 될 때 범위 {fix: [{name:'merge'}, {name:'style'}, {name:'e2eTest'}, {name:'unitTest'}]를 지정합니다.

allowCustomScopes: {boolean,default false}: 사용자 정의 scope 옵션을 추가하여 scope를 설정할 때 직접 입력을 지원합니다.

allow Breaking Changes: {Array of Strings: default none}: 원하는 scope 목록을 설정합니다. 예를 들어 ['feat','fix'].

appendBranchNameToCommitMessage: 협조breaking change cz-customizable-ghooks 에 따라 자동으로 지점 이름을 가져와commit 메시지에 추가할 수 있습니다. 이 기능은 cz-customizable 옵션에 추가되었습니다cz-customizable-ghooks ， , v1.3.0. 기본값은 cz-customizable-ghooks

입니다.

breakingPrefix: {string,default'BREAKING CHANGE:'}: 사용자 정의breaking change 블록을 설정합니다.

footerPrefix: {string,default'ISSUES CLOSED:'}: 사용자 정의 foot 블록을 설정합니다.

다음은 프로젝트 루트 디렉토리의 node 를 참조하는 예입니다.modules 아래 cz-customizable 아래 cz-config-EXAMPLE.js 파일:

module.exports = {
  types: [
    {value: 'feat',     name: 'feat:     A new feature'},
    {value: 'fix',      name: 'fix:      A bug fix'}
  ],
  scopes: [
    {name: 'accounts'},
    {name: 'admin'}
  ],
  messages: {
    type: 'Select the type of change that you\'re committing:',
    scope: '
Denote the SCOPE of this change (optional):',
    customScope: 'Denote the SCOPE of this change:', 
    // used if allowCustomScopes is true
  },
  allowCustomScopes: true,
  allowBreakingChanges: ['feat', 'fix']
}

이 때,commit 명령을 사용하면 사용자 정의 규범의commit 메시지 편집 옵션을 자동으로 가져옵니다.

Commit 메시지 확인

프로젝트에 commitlint/cli를 설치하려면 다음과 같이 하십시오.

npm i -D @commitlint/cli @commitlint/config-conventional

프로젝트 루트 디렉터리에commitlint를 만듭니다.config.js 파일:

module.exports = {extends: ['@commitlint/config-conventional']}

이 때,commitlint는 기본적으로angular규범에 따라commitmessage에 대한 검사를 하고, 사용자 정의 규범을 검사하려면rules 파라미터를 통해 실현할 수 있습니다.

module.exports = {
    extends: ['@commitlint/config-conventional'],
    rules: {
        'type-enum': [2, 'always', 
            ["feat", "fix", "docs", "style", "refactor", "test", "chore", "revert"]
        ],
        'subject-full-stop': [0, 'never'],
        'subject-case': [0, 'never']
    }
}

앞에서 cz를 사용하여commit 메시지 규범을 사용자 정의했기 때문에 다음은 cz규범에 따라 검사를 진행할 것입니다.
프로젝트에 commitlint-config-cz를 설치하려면 다음과 같이 하십시오.

npm i -D commitlint-config-cz @commitlint/cli

항목 수정 중commitlint.config.js 파일:

module.exports = {extends: ['cz'], rules:{}}

이때commitlint은 이전에 지정한 commit 메시지 규범을 검사할 수 있지만 commit 명령에 연결되지 않았습니다. 다음은 코드를 제출할 때 규범에 따라 제약을 받고 자동으로 검사합니다.
프로젝트에 husky를 설치하려면 다음과 같이 하십시오.

npm i -D husky

프로젝트 패키지 수정.json 파일:

"husky": {
    "hooks": { "commit-msg":"commitlint -e $GIT_PARAMS" }
},

이 때 코드를 제출할 때 이전에 정의한 규범에 따라commit 메시지를 제약하고 대응하는 규범에 따라 자동으로 검사합니다. 다음은 자동으로 Change log를 생성합니다. (angular 규범에 부합해야 합니다.)
프로젝트에 conventional-changelog-cli를 설치합니다.

npm i -D conventional-changelog-cli

출력 변경 로그

conventional-changelog -p angular -i CHANGELOG.md -s

실제 필요에 따라 Change log 명령을 출력하여 프로젝트에 package를 추가할 수 있습니다.json 파일:

"script":{
    "commit":"git-cz",
    "changelog":"conventional-changelog -p angular -i CHANGELOG.md -s",
}

코드 형식 검사

프로젝트에 eslint을 설치하려면:

npm i -D eslint

프로젝트에서 작성합니다.eslintrc.json/.eslintrc/.eslintrc.js (임의로 할 수 있으며 json 파일이 아니면 내보낼 필요가 있음) 자세한 설정은 Eslint 규칙 설명을 참조하고 다음은 예시 코드입니다.

{ //       
  "env": { //     
    "node": true, // brower、node、es6、mocha 
    "es6": true
  },
  "globals": { //     
    "vue": true, // "$"、"wx"、"ng" 
  },
  "parserOptions": { //     
    "ecmaVersion": 6,  //es   ，  5，  3、6（2015）、7（2016） 
    "ecmaFeatures": { //       ，globalReturn、impliedStrict、jsx
      "globalReturn": true,
      "jsx": true
    }
  },
  
  "rules": { //     ，0 'off'：    ；1 'warn'：    ，     （    ）；2 'error'：    ，     （    1，     ）。
    "camelcase": 2,
    "curly": 2,
    "brace-style": [2, "1tbs"],
    "quotes": [2, "single"],
    "semi": [2, "always"],
    "space-in-brackets": [2, "never"],
    "space-infix-ops": 2
  }
}

수동 설정 규범을 제외하고 현재 eslint 세 가지(Google,standard,airbnb)의 유행 규범을 사용할 수 있으며 이를 바탕으로 더욱 사용자 정의할 수 있다. 설치 방식은 다음과 같다.

npm i eslint-config-google -D

npm i eslint-config-standard eslint-plugin-import eslint-plugin-node eslint-plugin-promise eslint-plugin-standard -D 

npm i eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react -D

항목의 package를 수정합니다.json 파일:

"husky": {
    "hooks": {
      "commit-msg": "commitlint -e $GIT_PARAMS",
      "pre-commit" : "eslint ./app/**/*.js --fix"
    }
  },

eslint 규칙을 설정한 후 제출할 때 자동으로 이전의 사용자 정의 제약을 가져옵니다. 입력이 완료된 후에 commit 메시지를 자동으로 검사하고 코드 규범을 자동으로 검사합니다. 모두 통과해야만 제출할 수 있습니다. 그렇지 않으면 commit를 종료하고 명령을 사용하여change log 문서를 출력할 수 있습니다.
항목에 typescript를 사용하는 경우 응답 확인을 계속 추가할 수 있습니다.
프로젝트에 tslint을 설치하려면 다음과 같이 하십시오.

npm i -D tslint typescript

프로젝트에 tslint. 만들기json, 상세 구성 참조 TSLlint Rules, 다음 예제 코드:

{
  "lintOptions": {
    "typeCheck": true
  },
  "extends": [
    "tslint:recommended"
  ],
  "rules": {
    "no-constant-condition": true,
    "file-header": [
      true,
      "Author \\w{2,20}
Copyright 20\\d{2} Qietv"
    ],
    "max-line-length": [
      true,
      120
    ]
  }
}

수동 설정 사양 외에도 tslint-config-standard 등의 사양을 사용할 수 있으며 이를 바탕으로 다음과 같이 사용자 정의할 수 있습니다.

npm i tslint-config-standard -D

npm i tslint-eslint-rules -D 

프로젝트의 tslint 수정json 파일:

{
  "lintOptions": {
    "typeCheck": true
  },
  "extends": [
    "tslint:recommended",
    "tslint-config-standard"
  ],
  "rulesDirectory": [
    "node_modules/tslint-eslint-rules/dist/rules"
  ],
  "rules": {
    "no-constant-condition": true,
    "file-header": [
      true,
      "Author \\w{2,20}
Copyright 20\\d{2} Qietv"
    ],
    "max-line-length": [
      true,
      120
    ]
  }
}

이 외에 프로젝트에 tsconfig를 만들어야 합니다.json 파일, 예제 코드:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es2017",
    "sourceMap": true,
    "allowJs": true
  },
  "exclude": [
    "app/public",
    "app/views",
    "node_modules*"
  ]
}

항목의 package를 수정합니다.제출 작업에 ts 검증을 연결하는 json 파일:

"husky": {
    "hooks": {
      "commit-msg": "commitlint -e $GIT_PARAMS",
      "pre-commit" : "eslint ./app/**/*.js --fix && tslint ./app/**/*.ts --fix"
    }
  },

이 때 프로젝트에서 제출할 때 자동으로 이전의 사용자 정의 제약을 가져옵니다. 입력이 완료된 후에commit 메시지를 자동으로 검사하고 지정한 위치의 js와 ts 코드 규범을 자동으로 검사합니다. 모두 통과해야만 제출할 수 있습니다. 그렇지 않으면commit를 종료하고 명령으로change log 문서를 출력할 수 있습니다.