Введение в использование набора инструментов Cz — стандартные инструкции по коммитам Git

внешний интерфейс JavaScript

В совместном проекте с несколькими людьми, если GitОтправить инструкцииТочный, он станет хорошо документированным в пост-коллаборации и обработке ошибок, и развитие проекта может быть основано на спецификации.Отправить инструкцииБыстро создавайте журналы разработки, чтобы разработчики или пользователи могли отслеживать информацию о разработке и функциональные характеристики проекта.

Основное содержание этой статьи:

  • Введение для знакомстваУгловая спецификация(нужно перевернуть стену)Отправить инструкции
  • вводитьОтправить инструкцииНабор инструментовczКак пользоваться (адаптер, контрольная сумма и лог)
  • Введение для разработчиков, чтобы быстро создавать проектыczПлагин Vue CLI 3 для набора инструментов@ziyi2/ui-cz

Вот адрес демо-проекта:cz-example.

Инструкции по фиксации Git

Git требует рукописного ввода каждый раз, когда вы фиксируете кодОтправить инструкции(Сообщение фиксации):

git commit -m "hello world"

Чтобы написать несколько строк, используйте следующие команды:

git commit

В этот момент появится текстовый редактор, и вы можете написать несколько строк в текстовом редакторе.Отправить инструкции:

# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# On branch master
# Your branch is up to date with 'origin/master'.
#
# Changes to be committed:
#       new file:   package.json
#
G:/git-lab/cz/.git/COMMIT_EDITMSG [unix] (19:49 24/01/2019)

Если нет нормативаОтправить инструкции, трудно описать характер текущего представления кода (исправление ошибок, оптимизация производительности кода, новые функции или версии выпуска и т. д.). Проверьте Git для проектов VueОтправить инструкции(fixОбозначает исправления проблем,featУказывает, что нового...), что полностью соответствует спецификации Angular:

enter image description here

рукописный в соответствииОтправить инструкцииОшибок избежать сложно, а для достижения нормы можно использовать инструментыОтправить инструкции.

Инструкции по фиксации Canonical Git

  • Предоставляет больше исторической информации для быстрого просмотра
  • может фильтровать некоторыеcommit, для легкой фильтрации кодовreview
  • можно отследитьcommitСгенерированный журнал обновления
  • может быть связаноissues

GitПредставление Описание Структура

GitОтправить инструкцииМожно разделить на три части:Header,BodyиFooter.

<Header> <Body> <Footer>

Header

HeaderРаздел включает в себя три поляtype(обязательный),scope(необязательно) иsubject(обязательный).

<type>(<scope>): <subject>

Исходный код VueОтправить инструкцииОпущеноscope.

type

typeдля иллюстрацииcommitхарактер подачи.

ценность описывать
feat добавить функцию
fix исправить ошибку
docs Изменения в документации
style Формат кода (не влияет на функции, такие как исправления формата, такие как пробелы, точки с запятой и т. д.)
refactor Рефакторинг
perf Улучшить производительность
test контрольная работа
build Измените сборки проекта или внешние зависимости (например, области: webpack, gulp, npm и т. д.)
ci Измените файлы конфигурации программного обеспечения непрерывной интеграции и команды скриптов в пакете, такие как области действия: Travis, Circle и т. д.
chore Изменить процесс сборки или вспомогательные средства
revert резервный код

scope

scopeинструкцияcommitсфера влияния.scopeЭто зависит от проекта, например, в бизнес-проекте он может быть разделен по меню или функциональным модулям, если это разработка библиотеки компонентов, он может быть разделен по компонентам.

намекать:scopeМожно опустить.

subject

subjectдаcommitКраткое описание.

Body

commitПодробное описание, в котором объясняются подробные инструкции по отправке кода.

Footer

Если фиксация кодаНесовместимые измененияилизакрыть ошибку,ноFooterОбязателен, в противном случае его можно опустить.

Несовместимые изменения

Текущий код несовместим с предыдущей версией, тогдаFooterBREAKING CHANGEВ начале следует описание изменения, причина изменения и метод миграции.

закрыть ошибку

Если текущая заявка посвящена определенному вопросу, ее можноFooterЧастично заполните один ВОПРОС или ряд вопросов, которые необходимо закрыть.

Commitizen

commitizen/cz-cliдостижимая спецификацияОтправить инструкцииИнструмент:

When you commit with Commitizen, you'll be prompted to fill out any required commit fields at commit time. No more waiting until later for a git commit hook to run and reject your commit (though that can still be helpful). No more digging through CONTRIBUTING.md to find what the preferred format is. Get instant feedback on your commit message formatting and be prompted for required fields.

Предоставляет выбранные категории информации о представлении для быстрого созданияОтправить инструкции. Установите инструмент cz:

npm install -g commitizen

Адаптер Commitizen

cz-conventional-changelog

Если вам нужно использовать в своем проектеcommitizenСоздать совместимый с AngularJSОтправить инструкции, инициализацияcz-conventional-changelogадаптер:

commitizen init cz-conventional-changelog --save --save-exact

Если в настоящее время используются другие адаптеры, будет сообщено о следующей ошибке, которую можно добавить в это время.--forceвозможность повторной инициализации

Error: A previous adapter is already configured. Use --force to override

Команда инициализации в основном делает 3 вещи

  1. Установить в проектcz-conventional-changelogЗависимость адаптера

  2. Сохраните зависимости адаптера вpackage.jsonизdevDependenciesИнформация о поле

  3. существуетpackage.jsonновое вconfig.commitizenПоле информации, в основном используемое для настройки пути адаптера инструмента cz:

"devDependencies": {
 "cz-conventional-changelog": "^2.1.0"
},
"config": {
  "commitizen": {
    "path": "./node_modules/cz-conventional-changelog"
  }
}

Далее вы можете использовать команду czgit czзаменятьgit commitпровестиОтправить инструкции:

enter image description here

После отправки кода на удаленный Github его можно просмотреть в соответствующем проекте, например (здесь используетсяfeatНе очень уместно, просто пример):

enter image description here

cz-customizable

Если вы хотите настроить проектОтправить инструкции,можно использоватьcz-customizableадаптер:

Suitable for large teams working with multiple projects with their own commit scopes. When you specify the scopes in your .cz-config.js, cz-customizable allows you to select the pre-defined scopes. No more spelling mistakes embarrassing you when generating the changelog file.

Установите адаптер

npm install cz-customizable --save-dev

Преобразование ранее совместимого со спецификацией Angularcz-conventional-changelogПуть адаптера изменен наcz-customizableПуть адаптера:

"devDependencies": {
  "cz-customizable": "^5.3.0"
},
"config": {
  "commitizen": {
    "path": "node_modules/cz-customizable"
  }
}

cz-customizable сначала ищет файл с именем .cz-config.js, либо добавляет блок конфигурации в ваш package.json.

официальный.cz-config.jsобразец файлаcz-config-EXAMPLE.js,Следующее:

'use strict';

module.exports = {

  types: [
    {value: 'feat',     name: 'feat:     A new feature'},
    {value: 'fix',      name: 'fix:      A bug fix'},
    {value: 'docs',     name: 'docs:     Documentation only changes'},
    {value: 'style',    name: 'style:    Changes that do not affect the meaning of the code\n            (white-space, formatting, missing semi-colons, etc)'},
    {value: 'refactor', name: 'refactor: A code change that neither fixes a bug nor adds a feature'},
    {value: 'perf',     name: 'perf:     A code change that improves performance'},
    {value: 'test',     name: 'test:     Adding missing tests'},
    {value: 'chore',    name: 'chore:    Changes to the build process or auxiliary tools\n            and libraries such as documentation generation'},
    {value: 'revert',   name: 'revert:   Revert to a commit'},
    {value: 'WIP',      name: 'WIP:      Work in progress'}
  ],

  scopes: [
    {name: 'accounts'},
    {name: 'admin'},
    {name: 'exampleScope'},
    {name: 'changeMe'}
  ],

  // it needs to match the value for field type. Eg.: 'fix'
  /*
  scopeOverrides: {
    fix: [
      {name: 'merge'},
      {name: 'style'},
      {name: 'e2eTest'},
      {name: 'unitTest'}
    ]
  },
  */
  // override the messages, defaults are as follows
  messages: {
    type: 'Select the type of change that you\'re committing:',
    scope: '\nDenote the SCOPE of this change (optional):',
    // used if allowCustomScopes is true
    customScope: 'Denote the SCOPE of this change:',
    subject: 'Write a SHORT, IMPERATIVE tense description of the change:\n',
    body: 'Provide a LONGER description of the change (optional). Use "|" to break new line:\n',
    breaking: 'List any BREAKING CHANGES (optional):\n',
    footer: 'List any ISSUES CLOSED by this change (optional). E.g.: #31, #34:\n',
    confirmCommit: 'Are you sure you want to proceed with the commit above?'
  },

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

  // limit subject length
  subjectLimit: 100
  
};

Здесь он переработан на китайский язык (просто для иллюстрации примера пользовательских инструкций):

'use strict';

module.exports = {

  types: [
    {value: '特性',     name: '特性:    一个新的特性'},
    {value: '修复',      name: '修复:    修复一个Bug'},
    {value: '文档',     name: '文档:    变更的只有文档'},
    {value: '格式',    name: '格式:    空格, 分号等格式修复'},
    {value: '重构', name: '重构:    代码重构，注意和特性、修复区分开'},
    {value: '性能',     name: '性能:    提升性能'},
    {value: '测试',     name: '测试:    添加一个测试'},
    {value: '工具',    name: '工具:    开发工具变动(构建、脚手架工具等)'},
    {value: '回滚',   name: '回滚:    代码回退'}
  ],

  scopes: [
    {name: '模块1'},
    {name: '模块2'},
    {name: '模块3'},
    {name: '模块4'}
  ],

  // it needs to match the value for field type. Eg.: 'fix'
  /*
  scopeOverrides: {
    fix: [
      {name: 'merge'},
      {name: 'style'},
      {name: 'e2eTest'},
      {name: 'unitTest'}
    ]
  },
  */
  // override the messages, defaults are as follows
  messages: {
    type: '选择一种你的提交类型:',
    scope: '选择一个scope (可选):',
    // used if allowCustomScopes is true
    customScope: 'Denote the SCOPE of this change:',
    subject: '短说明:\n',
    body: '长说明，使用"|"换行(可选)：\n',
    breaking: '非兼容性说明 (可选):\n',
    footer: '关联关闭的issue，例如：#31, #34(可选):\n',
    confirmCommit: '确定提交说明?'
  },

  allowCustomScopes: true,
  allowBreakingChanges: ['特性', '修复'],

  // limit subject length
  subjectLimit: 100

};

использовать сноваgit czкоманда продолжитьОтправить инструкции:

enter image description here

Из рисунка выше видно, чтоОтправить инструкцииВарианты китаизированы, продолжаем заливатьОтправить инструкции:

enter image description here

Отправьте код на пульт, чтобы увидеть эффект:

enter image description here

Проверка Commitizen

commitlint

Убедитесь, что инструкции по отправке соответствуют спецификации, и установите средство проверки.commitlint:

npm install --save-dev @commitlint/cli

@commitlint/config-conventional

Установите правила проверки в стиле Angular

npm install --save-dev @commitlint/config-conventional

новое в проектеcommitlint.config.jsфайл и установить правила проверки:

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

Установите huksy (инструмент git hook)

npm install husky --save-dev

Настроить в package.jsongit commitКрючок проверки при отправке:

"husky": {
  "hooks": {
    "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
  }  
}

Следует отметить, что использование этого правила проверки не может.cz-config.jsДля пользовательской обработки, которая не соответствует угловой спецификации, таких как предыдущая локализация, вам нужно.cz-config.jsДокументация соответствует официальному образцу документации.cz-config-EXAMPLE.jsВнесите изменения в стиле Angular.

Коммит инструкции для ошибок выполнения:

enter image description here

Выполните инструкции фиксации, соответствующие спецификации Angular:

enter image description here

commitlint необходимо настроить правило проверки,@commitlint/config-conventionalЭто правило проверки, соответствующее спецификации Angular.

commitlint-config-cz

при использованииcz-customizableАдаптер выполняет настройку описания отправки, которая разрушает стиль Angular, тогда правило **@commitlint/config-conventional** нельзя использовать для проверки описания отправки, вы можете использоватьcommitlint-config-czПроверка индивидуальных инструкций по отправке.

Установите правила проверки:

npm install commitlint-config-cz --save-dev

Затем добавьте конфигурацию правила проверки commitlint:

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

Рекомендуется использовать правила проверки **@commitlint/config-conventional**.Если вы хотите использовать настраиваемый адаптер cz, настроенная конфигурация не должна нарушать спецификацию Angular.

validate-commit-msg

Помимо использованияcommitlintинструмент проверки, вы также можете использоватьvalidate-commit-msgИнструмент проверки проверяет, соответствует ли описание отправки cz спецификации Angular.

Журнал фиксации

если используетсяczнабор инструментов, наборconventional-changelogЖурналы разработки могут быть созданы быстро:

npm install conventional-changelog -D

существуетpacage.jsonДобавьте команду создания журнала в:

"version": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add CHANGELOG.md"

You could follow the following workflow

  • Make changes
  • Commit those changes
  • Pull all the tags
  • Run the npm version [patch|minor|major] command
  • Push

воплощать в жизньnpm run versionЖурнал производства можно посмотреть позжеCHANGELOG.md.

Будьте осторожны, чтобы использовать правильныйHeaderизtype, иначе сгенерированный лог будет неточным, вот только пример, сгенерированный лог не очень строгий.

Плагин Vue CLI 3

Если вы чувствуете громоздкий для вышеупомянутой конфигурации, предоставляя плагин Vue CLI 3 здесь, если разработка проекта, сгенерированного системой VUE CLI 3, вы можете использовать плагины@ziyi2/ui-czГенерация в один клик:

vue add @ziyi2/ui-cz

Плагин используетcz-customizableНастройкаОтправить инструкцииадаптер,@commitlint/config-conventionalправила проверки иconventional-changelogГенератор логов.

Суммировать

Я призываю всех писать стандартизированные инструкции по отправке, инструкции по коду не стандартизированы, и у участников проекта две строчки слез. Адрес демонстрационного проекта:cz-example.

Ссылка на сайт

Категории