freepik
freepik

В процессе разработки проекта со временем могут накапливаться неиспользуемые зависимости. Они увеличивают размер проекта и могут создавать потенциальные уязвимости. Рассмотрим основные методы очистки проекта от таких зависимостей.

Инструменты для поиска неиспользуемых зависимостей

npm-check
Этот инструмент позволяет находить неиспользуемые зависимости и обновлять устаревшие модули. Для работы выполните:

npm install -g npm-check
npm-check

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

depcheck

Популярное решение для статического анализа зависимостей. Оно обнаруживает как ненужные, так и отсутствующие библиотеки:

npm install -g depcheck
depcheck

⚠️ Учтите: depcheck имеет ограничения — например, плохо работает с динамическими импортами.

Ручная проверка зависимостей

Для небольших проектов вы можете открыть package.json и вручную проверить каждую библиотеку, используя поиск в IDE. Однако для больших приложений это занимает слишком много времени.

 Анализ с помощью Webpack или других сборщиков

Для проектов, использующих Webpack, подходит плагин webpack-bundle-analyzer:

npm install --save-dev webpack-bundle-analyzer

Добавьте его в конфигурацию Webpack:

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
  plugins: [new BundleAnalyzerPlugin()],
};

После сборки получите визуальный отчёт с информацией о ненужных зависимостях.

Для сборщиков Vite или Rollup можно использовать аналогичные плагины, такие как Vite-plugin-analyzer.

Удаление ненужных зависимостей

После выявления неиспользуемых библиотек удалите их командами:

npm uninstall <имя-зависимости>

или:

yarn remove <имя-зависимости>

Регулярная проверка

Рекомендуется перед каждым релизом запускать depcheck или аналогичные инструменты, чтобы своевременно удалять неиспользуемые модули.

Проверка зависимостей в процессе код-ревью

На командных проектах добавьте проверку изменений в package.json в список задач для код-ревью. Это поможет отслеживать неиспользуемые или случайно добавленные библиотеки.

Использование TypeScript

Проекты на TypeScript позволяют получать автоматические предупреждения о неиспользуемых переменных и параметрах через настройки компилятора:

{
  "compilerOptions": {
    "noUnusedLocals": true,
    "noUnusedParameters": true
  }
}

Документирование зависимостей

Ведите документацию для каждой зависимости, указывая её назначение. Это особенно полезно в командах, так как позволяет избежать случайного добавления ненужных библиотек.

Советы

  1. Комбинируйте инструменты: используйте depcheck для выявления ненужных зависимостей, TypeScript — для анализа кода, а CI/CD — для автоматизации проверки.

  2. Регулярные проверки: оптимизация зависимостей должна быть частью релизного цикла.

  3. Используйте новые сборщики: если вы используете Webpack, рассмотрите переход на Vite для упрощения анализа.

  4. Устаревшие библиотеки: дополнительно проверяйте библиотеки, которые больше не поддерживаются, с помощью инструментов вроде npm outdated, Snyk или Dependabot.

Устаревшие подходы

  1. Ручная проверка: неэффективна для крупных проектов, лучше использовать автоматизацию.

  2. Ограничения depcheck: не поддерживает динамические импорты. Рекомендуется комбинировать с eslint-plugin-unused-imports или встроенными функциями IDE.

  3. Без автоматизации в CI/CD: без проверки зависимостей на этапе pull request риск накопления ненужных библиотек возрастает.

Удаление неиспользуемых зависимостей — важная часть поддержки проекта. Комбинируя автоматизированные инструменты и ручную проверку, можно поддерживать проект в чистоте, повышая его производительность и безопасность.

Комментарии (1)


  1. artptr86
    06.12.2024 20:55

    После сборки получите визуальный отчёт с информацией о ненужных зависимостях.

    Вот эта фраза очень похожа на галлюцинацию нейросети