Parsing error: ESLint was configured to run xxx However, that TSConfig does not include this file
leo-coco opened this issue · 1 comments
I used to have a working project. I'm in the middle of moving to vite
, vue 2.7
etc and part of this transition is eslint
I had to update eslint airbnb
and to install eslint-config-airbnb-typescript
to fix some errors.
My issue
When running eslint . --fix --max-warnings=0
in apps/my-app
I have 650 error messages. All are of this type
Parsing error: ESLint was configured to run on <tsconfigRootDir>/src/ui/views/pages/case-files/details/case-file-activity/components/CaseFileAssignmentsOld.vue
using parserOptions.project: <tsconfigRootDir>/../../../../../../../users/xxx/documents/github/frontend-app/apps/my-app/tsconfig.eslint.json
I don't understand the issue since the files I want to ESLINT .vue
, .js
, .ts
are already included in my tsconfig.json
Annexes
I have a monorepository structure
In my root project folder
The eslintrc.js
on the root of the whole project contains
module.exports = {
env: {
jest: true,
es2021: true,
},
extends: [
'plugin:vue/recommended',
'eslint:recommended',
'@vue/eslint-config-airbnb',
'plugin:vuejs-accessibility/recommended',
'airbnb-typescript/base',
],
rules: {
'no-console': process.env.APP_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.APP_ENV === 'production' ? 'error' : 'off',
'no-param-reassign': ['error', { props: false }],
complexity: ['error', { max: 16 }],
'max-depth': ['error', 3],
'max-params': ['error', 4],
'max-nested-callbacks': ['error', 4],
'max-statements': ['error', 31, { ignoreTopLevelFunctions: true }],
'max-lines': ['error', { max: 1000, skipBlankLines: true, skipComments: true }],
'max-len': ['error', {
code: 170, tabWidth: 4, ignoreUrls: true, ignoreComments: true,
}],
'prefer-destructuring': ['error', { object: false, array: false }],
'max-lines-per-function': ['error', { max: 155, skipBlankLines: true, skipComments: true }],
'vue/max-attributes-per-line': ['error', {
singleline: 8,
multiline: {
max: 1,
},
}],
'vue/max-len': ['error', {
code: 165,
},
],
'vue/html-closing-bracket-newline': ['error', {
singleline: 'never',
multiline: 'never',
}],
'linebreak-style': 0,
'no-shadow': 'off',
'no-unused-expressions': ['error', { allowShortCircuit: true, allowTernary: true }],
'import/prefer-default-export': 'off',
'import/no-extraneous-dependencies': ['error', { devDependencies: true }],
'no-useless-constructor': 'off',
'class-methods-use-this': 'off',
'vue/valid-v-slot': ['error', {
allowModifiers: true,
}],
curly: ['error', 'all'],
'no-underscore-dangle': 'off',
'brace-style': [1, '1tbs', { allowSingleLine: false }],
},
parserOptions: {
parser: '@typescript-eslint/parser',
extraFileExtensions: ['.vue'],
},
overrides: [
{
files: [
'**/__tests__/*.{j,t}s?(x)',
'**/tests/unit/**/*.spec.{j,t}s?(x)',
'*.spec.{j,t}s?(x)',
'*.test.{j,t}s?(x)',
],
env: {
jest: true,
es2021: true,
},
rules: {
'max-lines-per-function': 0,
'max-nested-callbacks': 0,
'max-lines': 0,
'@typescript-eslint/no-shadow': 0,
},
},
{
files: ['**/__mocks__/*.ts', '**/__mocks__/*.js'],
rules: {
'max-lines-per-function': 0,
'max-nested-callbacks': 0,
'max-lines': 0,
},
},
{
files: ['**/*.ts', '**/*.tsx', '**/*.vue'],
extends: [
'@vue/typescript/recommended',
],
plugins: ['@typescript-eslint/eslint-plugin'],
rules: {
'@typescript-eslint/indent': 'off', // So there is no conflict between indents of others
'@typescript-eslint/explicit-module-boundary-types': 'off',
'@typescript-eslint/no-empty-interface': 'off',
'@typescript-eslint/no-empty-function': 2,
},
},
],
plugins: ['vuejs-accessibility'],
ignorePatterns: ['dist/**', 'node_modules/**'],
};
In my app folder
The eslintrc.js
const path = require('path');
const baseConfig = require('../../.eslintrc');
module.exports = {
...baseConfig,
root: true,
settings: {
'import/resolver': {
node: {
paths: ['src'],
},
typescript: {
project: [
path.resolve(__dirname, 'tsconfig.json'),
],
},
},
},
parserOptions: {
project: path.resolve(__dirname, 'tsconfig.eslint.json'),
tsconfigRootDir: __dirname,
},
};
The tsconfig.json
{
"compilerOptions": {
"preserveSymlinks": true,
"strictNullChecks": false,
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"allowJs": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"skipLibCheck": true, // Fixes testcafe + jest type collision
"isolatedModules": true,
"types": [
"jest",
"vuetify",
"vue-meta",
"vite/client",
],
"paths": {
"@/*": [
"src/*"
],
"@libs/registration-lib/*": [
"../../libs/registration-lib/src/*"
],
"@libs/component-lib/*": [
"../../libs/component-lib/src/*"
],
"@libs/shared-lib/*": [
"../../libs/shared-lib/src/*"
],
"@libs/assets/*": [
"../../libs/assets/*"
],
"@libs/entities-lib/*": [
"../../libs/entities-lib/src/*"
],
"@libs/services-lib/*": [
"../../libs/services-lib/src/*"
]
},
"lib": [
"es2019",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.js",
"src/**/*.tsx",
"src/**/*.vue",
"typings/**.ts",
],
"exclude": [
"node_modules",
]
}
The tsconfig.eslint.json
{
"extends": "./tsconfig.json",
"include": [
// add all files in which you see the "parserOptions.project" error
"**.js",
"**.json",
"**.ts",
],
}
Is this still an issue for you @leo-coco? I imagine you've gotten it worked out in the past couple of years, but just in case, I'd be happy to help if you're still having trouble. If not, it may help other people to post what you've done to work around this since then and/or close out the issue.
Relatedly, I'll be making a ticket and PR to update this project over to the new version of typescript-eslint
, which will expose their new project services system that allows discovery of tsconfig.json
files automatically, adds proper support for extends
and references
, and allows linting files not included in tsconfig.json
(meaning no more tsconfig.eslint.json
).