[英]When running "ng lint" in a clean Angular project eslint gives errors for a completely different project in another folder
我對 Eslint 和 Angular 有一個非常奇怪的問題。 每次我運行ng lint時,都會出現以下錯誤:
發生未處理的異常:無法讀取配置文件:[COMPLETELY_DIFFERENT_PROJECT_PATH]\node_modules\eslint-config-prettier@typescript-eslint.js 錯誤:“prettier/@typescript-eslint”已合並到 eslint-config-prettier 中的“prettier”中8.0.0。 請參閱: https ://github.com/prettier/eslint-config-prettier/blob/main/CHANGELOG.md#version-800-2021-02-21
引用自:[COMPLETELY_DIFFERENT_PROJECT_PATH]\node_modules@nestjs\axios.eslintrc.js 有關詳細信息,請參閱“[USER]\AppData\Local\Temp\ng-H0X9RR\angular-errors.log”。
請注意,這些錯誤發生在與我運行ng lint命令的項目完全不同的項目和文件夾中。
為了驗證這個問題,我創建了一個全新的 Angular 項目,使用
新的
然后使用添加eslint原理圖
ng 添加@angular-eslint/schematics
這會生成以下項目文件:
.eslintrc.json
{
"root": true,
"ignorePatterns": [
"projects/**/*"
],
"overrides": [
{
"files": [
"*.ts"
],
"parserOptions": {
"project": [
"tsconfig.json"
],
"createDefaultProgram": true
},
"extends": [
"plugin:@angular-eslint/recommended",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "app",
"style": "camelCase"
}
],
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "app",
"style": "kebab-case"
}
]
}
},
{
"files": [
"*.html"
],
"extends": [
"plugin:@angular-eslint/template/recommended"
],
"rules": {}
}
]
}
包.json
{
"name": "new-angular-project",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test",
"lint": "ng lint"
},
"private": true,
"dependencies": {
"@angular/animations": "~13.3.0",
"@angular/common": "~13.3.0",
"@angular/compiler": "~13.3.0",
"@angular/core": "~13.3.0",
"@angular/forms": "~13.3.0",
"@angular/platform-browser": "~13.3.0",
"@angular/platform-browser-dynamic": "~13.3.0",
"@angular/router": "~13.3.0",
"rxjs": "~7.5.0",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "~13.3.5",
"@angular-eslint/builder": "13.2.1",
"@angular-eslint/eslint-plugin": "13.2.1",
"@angular-eslint/eslint-plugin-template": "13.2.1",
"@angular-eslint/schematics": "13.2.1",
"@angular-eslint/template-parser": "13.2.1",
"@angular/cli": "~13.3.5",
"@angular/compiler-cli": "~13.3.0",
"@types/jasmine": "~3.10.0",
"@types/node": "^12.11.1",
"@typescript-eslint/eslint-plugin": "5.17.0",
"@typescript-eslint/parser": "5.17.0",
"eslint": "^8.12.0",
"jasmine-core": "~4.0.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.1.0",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "~1.7.0",
"typescript": "~4.6.2"
}
}
角.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"newAngularProject": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
},
"@schematics/angular:application": {
"strict": true
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/new-angular-project",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"inlineStyleLanguage": "scss",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"outputHashing": "all"
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"browserTarget": "newAngularProject:build:production"
},
"development": {
"browserTarget": "newAngularProject:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "newAngularProject:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"inlineStyleLanguage": "scss",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-eslint/builder:lint",
"options": {
"lintFilePatterns": [
"src/**/*.ts",
"src/**/*.html"
]
}
}
}
}
},
"defaultProject": "newAngularProject",
"cli": {
"defaultCollection": "@angular-eslint/schematics"
}
}
但即使對於一個完全干凈的項目,運行ng lint仍然會給我關於與我正在運行它的項目完全不同的文件夾中的文件的錯誤。 我已經從高處和低處搜索了一個解決方案,但我似乎找不到任何解決方案。
我還覺得奇怪的是 VSCode 中用於在編程時檢測 linting 問題的 eslint 擴展確實有效: https ://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
我完全被這個難住了。 有誰能幫助我嗎?
嘗試指定工作目錄eslint --ext .js,.ts .
.
或者, ng lint --files=src/**/*.ts
。 您可以將其添加到package.json
中: lint:eslint --ext .js,.ts .
並運行npm run lint
根據 Idan Rokach 的回答找到了完整的解決方案。 我最終將"lint": "eslint --ext .js,.ts src"
添加到package.json
以僅對src
文件夾執行 linting。 仍然不確定根本原因是什么,但至少這是可行的。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.