Ошибка ESLint "Unable to resolve path to module" при импорте TypeScript-файлов
Причина ошибки
Ошибка Unable to resolve path to module возникает из-за того, что ESLint использует стандартный Node.js резолвер для поиска модулей, который ищет файлы с расширениями .js, .json и .node. TypeScript-файлы (.ts, .tsx) не входят в этот список по умолчанию. При этом сам TypeScript имеет свою собственную систему разрешения модулей, которая учитывает его расширения.
Решение: настройка eslint-import-resolver-typescript
Для правильной работы ESLint с TypeScript необходимо установить и настроить плагин eslint-plugin-import вместе с резолвером eslint-import-resolver-typescript. Этот резолвер научит ESLint понимать TypeScript-расширения и учитывать настройки tsconfig.json.
Шаг 1: Установка зависимостей
npm install --save-dev eslint-plugin-import eslint-import-resolver-typescript
Шаг 2: Обновление конфигурации ESLint
В вашем .eslintrc.json нужно добавить плагин import и настроить резолвер:
{
"parser": "@typescript-eslint/parser",
"plugins": ["@typescript-eslint", "import"],
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"plugin:import/recommended",
"plugin:import/typescript"
],
"settings": {
"import/resolver": {
"typescript": {
"alwaysTryTypes": true,
"project": "./tsconfig.json"
}
}
},
"rules": {
"import/no-unresolved": "error"
}
}
Шаг 3: Проверка tsconfig.json
Убедитесь, что ваш tsconfig.json корректно настроен. Минимальная конфигурация:
{
"compilerOptions": {
"target": "ES2020",
"module": "ESNext",
"moduleResolution": "node",
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
},
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"skipLibCheck": true
},
"include": ["src/**/*.ts", "src/**/*.tsx"],
"exclude": ["node_modules"]
}
Дополнительные рекомендации
- Укажите расширения для импортов: В правиле
import/extensionsможно настроить, какие расширения нужно указывать явно:"rules": { "import/extensions": ["error", "ignorePackages", { "ts": "never", "tsx": "never" }] } - Для монорепозиториев: Если у вас несколько tsconfig-файлов, укажите их в массиве:
"settings": { "import/resolver": { "typescript": { "project": [ "packages/*/tsconfig.json", "apps/*/tsconfig.json" ] } } } - Проверка путей: Убедитесь, что ваш
baseUrlв tsconfig.json соответствует структуре проекта. Если вы используете алиасы (например,@/components/Button), резолвер автоматически их поддержит.
Проверка решения
После настройки выполните ESLint снова:
npx eslint src/index.ts
Ошибка Unable to resolve path to module должна исчезнуть, а импорты TypeScript-файлов будут корректно обрабатываться.
Если проблема осталась
- Перезапустите редактор кода (особенно если используете VSCode с расширением ESLint)
- Проверьте, что все зависимости установлены в одной директории (не глобально)
- Убедитесь, что ваш
tsconfig.jsonнаходится в корне проекта и ESLint видит его
Альтернативный подход: использование @typescript-eslint/eslint-plugin
Если вы не хотите подключать дополнительный плагин eslint-plugin-import, можно решить проблему другим способом — настроить ESLint через @typescript-eslint/parser с дополнительными опциями.
Настройка parserOptions
Добавьте в .eslintrc.json следующие настройки:
{
"parser": "@typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.json",
"tsconfigRootDir": ".",
"ecmaVersion": 2020,
"sourceType": "module"
},
"plugins": ["@typescript-eslint"],
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended-requiring-type-checking"
],
"rules": {
"@typescript-eslint/no-unused-vars": "error"
}
}
Важные моменты
- Этот подход использует TypeScript-компилятор для разрешения модулей, что может замедлить линтинг на больших проектах
- Требуется, чтобы
tsconfig.jsonбыл корректным и включал все необходимые файлы - Не поддерживает алиасы путей из коробки — нужно дополнительно настраивать через
import/resolver
Когда это подходит
Этот метод хорош для небольших проектов или когда вы уже используете типизированные правила (recommended-requiring-type-checking). Для крупных проектов с большим количеством файлов и алиасами путей лучше использовать первый вариант с eslint-import-resolver-typescript.
Ответов пока нет.
Войдите чтобы оставить ответ