Angular14项目安装@angular-eslint/schematics失败如何解决

你当前使用的是Angular 14.x版本，安装失败本质是三个问题：

1. 提前零散安装了版本不匹配的eslint、@angular-eslint/template-parser，和@angular-eslint套件要求的完整依赖版本不一致，触发peer依赖冲突
2. 部分项目中残留已废弃的TSLint、codelyzer、protractor依赖，和ESLint工具链存在隐性冲突
3. 之前混用普通用户/管理员权限执行安装命令，导致项目目录下node_modules权限混乱，所谓管理员权限下的报错是权限紊乱的次生问题，不是安装必须要管理员权限

• 第一步：彻底清理残留文件与错误依赖
  先在项目根目录执行命令清理旧文件：

  # 删除现有依赖目录和锁文件
  rm -rf node_modules package-lock.json
  # 强制清空npm本地缓存
  npm cache clean --force
  

  打开项目的package.json文件，手动删除devDependencies节点下所有和lint相关的零散依赖：eslint、@angular-eslint/template-parser、codelyzer、tslint、protractor。
  后续所有npm/ng命令禁止使用管理员权限执行。如果之前用管理员权限执行过安装命令，先修复项目目录权限：Windows系统右键项目文件夹→属性→安全→给当前登录用户分配完全控制权限；Mac/Linux系统执行sudo chown -R $USER:$USER 你的项目绝对路径即可。
• 第二步：手动安装版本完全匹配的依赖套件
  Angular 14.x对应的@angular-eslint兼容大版本为14.x，不要直接装latest/next版本（高版本不兼容Angular14）。跳过ng add的自动安装逻辑（自动版本解析很容易被本地环境干扰出错），直接手动安装所有经过兼容性验证的依赖：

  npm install --save-dev --legacy-peer-deps eslint@^8.18.0 @angular-eslint/builder@14.4.0 @angular-eslint/eslint-plugin@14.4.0 @angular-eslint/eslint-plugin-template@14.4.0 @angular-eslint/schematics@14.4.0 @angular-eslint/template-parser@14.4.0 @typescript-eslint/eslint-plugin@5.36.2 @typescript-eslint/parser@5.36.2
  

• 第三步：初始化ESLint配置
  依赖安装完成后，执行schematics命令生成配置，跳过自动安装步骤：

  ng g @angular-eslint/schematics:ng-add --skip-confirmation
  

  该命令会自动完成三项配置：在angular.json中添加lint执行target、生成根目录.eslintrc.json规则文件、移除项目中残留的TSLint相关配置引用。
• 第四步：验证安装结果
  执行lint命令检查是否正常工作：

  ng lint
  

  命令正常输出lint检查结果、无安装类报错即代表接入成功。

• 执行初始化命令提示找不到@angular-eslint/schematics时，关闭当前终端重新打开，进入项目根目录重跑命令即可，属于终端路径缓存问题。
• 如果仍提示依赖冲突，检查package.json中typescript版本是否为~4.7.x，你当前使用的4.7.4是符合要求的，不要升级TypeScript到4.8及以上版本，Angular14不兼容高版本TS。
• 如果安装过程中提示版本不匹配，优先检查是否有漏删之前手动安装的零散eslint相关依赖，残留的不匹配版本包是触发冲突的最常见原因。

内容的提问来源于stack exchange，提问作者Serhii Derkach