Spring Tool Suite每行均报错？Spring+Angular5项目异常原因及解决

嘿，这个问题我之前在整合Spring和Angular 5项目的时候也遇到过，简直让人头大！其实本质是STS的TypeScript语言服务闹了个乌龙，把HTML文件当成TypeScript文件来解析了，才会出现这些莫名其妙的Cannot find name错误。下面给你拆解原因和解决办法：

这种错误本质是STS的TypeScript语言服务出现了误判，主要有这几个诱因：

• STS的文件关联配置出错，把.html后缀的文件归到了TypeScript的检查范围内，导致它试图把HTML标签（比如<html>、<!doctype>）当作TS变量/标识符来解析，自然找不到对应的定义。
• 项目根目录的.project配置文件（STS专属的项目配置）里，错误地将HTML文件和TypeScript编辑器绑定，触发了不必要的TS语法检查。
• 你用的STS版本和Angular 5的兼容性不佳——Angular 5是比较旧的版本，太新或太旧的STS都可能出现语言服务识别偏差。

方法一：修正STS的文件关联设置 #

这是最直接的解决方案：

• 打开STS的偏好设置：点击顶部菜单 Window > Preferences
• 依次展开 General > Content Types > Text > TypeScript
• 在右侧的「File associations」区域，检查是否有.html后缀，如果有，选中它然后点击Remove按钮移除
• 点击Apply and Close，重启STS后再查看项目，错误应该就消失了

方法二：手动修复.project配置文件 #

如果文件关联设置没生效，可以直接修改项目的配置文件：

• 先关闭STS，找到项目根目录下的.project文件（这是隐藏文件，需要显示隐藏文件才能看到）
• 用记事本或代码编辑器打开它，查找包含TypeScript的配置节点，比如<buildCommand>或者<nature>相关的内容，确保只有.ts文件被关联，把所有涉及.html的错误关联项删除
• 保存文件后，重新把项目导入STS

方法三：升级/降级到兼容的STS版本 #

Angular 5对STS版本有一定要求，建议使用STS 3.9.x系列（这个版本对Angular 5的支持最稳定）：

• 下载对应版本的STS并安装
• 导入项目后，执行Project > Clean...，选择你的项目清理缓存，再重新构建项目

方法四：临时禁用HTML文件的TS检查（应急方案） #

如果上面的方法都来不及操作，可以先临时关闭HTML文件的TS检查：

• 右键项目，选择Properties > TypeScript
• 切换到Validation选项卡，取消勾选「Enable TypeScript validation for HTML files」
• 点击Apply and Close，错误会暂时消失

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