Import Chain 🔗
VS Code расширение для просмотра цепочки импортов от текущего файла до корня проекта.
Возможности
- 📄 Автоматически показывает цепочку импортов для открытого файла
- ⬆️ Отображает путь вверх: кто импортирует этот файл, и кто импортирует того, и т.д.
- 🏠 Показывает достигает ли цепочка корня (
main.ts, index.ts, App.vue)
- ⚠️ Выявляет "мёртвый код" - файлы, которые никем не используются
- 🖱️ Клик по элементу открывает файл
Установка
Из исходников
cd import-chain-extension
npm install
npm run compile
Установка в VS Code / Cursor
- Откройте папку расширения в VS Code
- Нажмите
F5 для запуска в режиме отладки
- Или упакуйте и установите:
npm install -g @vscode/vsce
vsce package
code --install-extension import-chain-0.0.1.vsix
Использование
- Откройте любой
.ts, .js, .vue, .tsx или .jsx файл
- В Explorer (боковая панель) появится секция "Import Chain ⬆️"
- Вы увидите цепочку файлов, которые импортируют текущий файл
- Кликните на любой файл в цепочке, чтобы перейти к нему
Пример вывода
📄 Select.vue (текущий файл)
↑ SelectExample.vue components/
↑ SelectAdvancedDemo.vue views/
↑ router/index.ts router/
🏠 main.ts src/ ROOT
Иконки
- 📄 - текущий открытый файл
- ↑ - файл, который импортирует предыдущий
- 🏠 - корневой файл (main.ts, index.ts, App.vue)
- ⚠️ - тупик (файл никем не импортируется)
Команды
- Import Chain: Refresh - перестроить граф зависимостей (кнопка 🔄 в заголовке панели)
| |