Workflow разработки

Проект использует современные инструменты автоматизации для обеспечения качества кода и консистентности коммитов.

Git Hooks с Husky

Проект настроен на использование Husky для автоматического выполнения проверок перед коммитом и пушем.

Установка Husky

npm run husky:install

Эта команда установит все git hooks в папку .husky/.

Pre-Commit Hook

Выполняется перед каждым коммитом и проверяет staged файлы.

Этапы выполнения

1. Remove Comments (scripts:remove-comments:staged)

   • Удаляет комментарии из TypeScript файлов
   • Применяется только к staged файлам
   • Скрипт: scripts/remove-comments.script.ts

2. Remove Return Types (scripts:remove-return-types:staged)

   • Удаляет явные return types из функций
   • TypeScript сам их выведет
   • Скрипт: scripts/remove-return-types.script.ts

3. Code Formatting (pretty-quick --staged)

   • Форматирует код через Prettier
   • Применяется только к staged файлам

4. Linting (lint-staged)

   • Запускает ESLint для .ts/.tsx файлов
   • Запускает Stylelint для .scss/.css файлов
   • Конфигурация: .lintstagedrc.json

Если любой этап не пройдёт — коммит будет отменён.

Пример выполнения

$ git commit -m "feat: add new feature"

# Выполняется:
# 1. Remove comments from staged .ts files
# 2. Remove return types from staged .ts files
# 3. Format code with Prettier
# 4. Run ESLint on staged .ts/.tsx
# 5. Run Stylelint on staged .scss

Pre-Push Hook

Выполняется перед пушем в репозиторий и проверяет весь проект.

Этапы выполнения

#!/bin/bash
echo "Running pre-push checks..."

# 1. TypeScript Type Check
echo "TypeScript type check..."
npm run typecheck || exit 1

# 2. ESLint Check
echo "Linting code..."
npm run lint:check || exit 1

# 3. Production Build
echo "Testing build..."
npm run build -- --configuration=production || exit 1

echo "All checks passed!"

Проверяемые аспекты

1. Типы TypeScript (npm run typecheck)

   • tsc --noEmit — проверка типов без компиляции
   • Все типы должны быть корректными

2. Качество кода (npm run lint:check)

   • ESLint проверка всего src/
   • Должны быть исправлены все ошибки

3. Production Build (npm run build --configuration=production)

   • Полная сборка для production
   • Проверка, что код компилируется
   • Проверка бандла размера

Если любой этап не пройдёт — пуш будет отменён.

Lint-Staged конфигурация

Файл: .lintstagedrc.json

{
	"*.{js,jsx,ts,tsx}": "npm run lint:staged",
	"*.{css,scss}": "npm run slint:staged"
}

Что это делает:

• Для .ts/.tsx файлов: запускает npm run lint:staged (ESLint с --fix)
• Для .scss/.css файлов: запускает npm run slint:staged (Stylelint с --fix)

Автоматические скрипты

Remove Comments Script

Файл: scripts/remove-comments.script.ts

Что делает:

• Удаляет все комментарии из TypeScript кода
• Работает с .ts и .tsx файлами
• Создаёт backup по умолчанию

Опции:

# Обычное выполнение (без backup)
npm run scripts:remove-comments

# Dry-run (показывает что изменится, не применяет)
npm run scripts:remove-comments -- --dry-run

# Verbose режим
npm run scripts:remove-comments -- --verbose

Что НЕ удаляется:

• JSDoc комментарии (документация)
• Комментарии в строках после кода
• Комментарии в больших блоках

Remove Return Types Script

Файл: scripts/remove-return-types.script.ts

Что делает:

• Удаляет явные return types из функций и методов
• TypeScript сам выведет тип, это снижает boilerplate
• Исключает файлы: *.interface.ts, *.type.ts, *.spec.ts, *.test.ts

Опции:

# Обычное выполнение (без backup)
npm run scripts:remove-return-types

# Dry-run
npm run scripts:remove-return-types -- --dry-run

# Debug режим
npm run scripts:remove-return-types -- --debug

Примеры:

// Было
function getValue(): string {
	return "hello";
}

// Стало
function getValue() {
	return "hello";
}

Development Workflow

Типичный workflow для разработчика

# 1. Создать ветку
git checkout -b feature/my-feature

# 2. Написать код
# Код и коммиты...

# 3. Добавить файлы
git add .

# 4. Сделать коммит
git commit -m "feat: add new feature"
# Автоматически выполнится pre-commit hook:
# - Удаления комментарии
# - Удалятся return types
# - Код отформатируется
# - Запустится ESLint и Stylelint

# 5. Запушить
git push origin feature/my-feature
# Автоматически выполнится pre-push hook:
# - Проверка типов
# - Проверка линтера
# - Production build

# 6. Создать Pull Request

Проверка до коммита

Если вы хотите проверить, что пройдёт hook:

npm run typecheck      # Проверить типы
npm run lint:check     # Проверить ESLint
npm run slint:check    # Проверить Stylelint
npm run format:check   # Проверить Prettier
npm run build:prod     # Собрать для production

Пропуск hooks (не рекомендуется!)

Если срочно нужно пропустить hooks:

# Пропустить pre-commit
git commit --no-verify -m "message"

# Пропустить pre-push
git push --no-verify

Внимание!

Пропускать hooks НЕ рекомендуется. Они существуют, чтобы защитить качество кода в репозитории.

Troubleshooting

Hook не выполняется

# Переустановить hooks
npm run husky:install

# Проверить что hooks установлены
ls -la .husky/

Pre-commit не хочет пропускать файлы

# Принудительно добавить файлы
git add --force файл.ts
git commit -m "message"

Build падает при пуше

# Собрать локально для production
npm run build:prod

# Если работает локально, но не работает в hooks:
npm run typecheck
npm run lint:check

Best Practices

✅ Делайте:

• Часто коммитьте (маленькие атомарные коммиты)
• Читайте сообщения об ошибках в hooks
• Исправляйте ошибки перед пушем
• Используйте git для отката, если нужно

❌ Не делайте:

• Не пропускайте hooks без причины
• Не коммитьте код с ошибками линтера
• Не игнорируйте типы TypeScript
• Не оставляйте комментарии в коде

Следующие шаги

• Качество кода — ESLint, Stylelint, Prettier
• Правила кода — стандарты написания
• Архитектура — структура проекта