Angular应用未配置robots.txt遭Lighthouse误判无效求助

问题根源 #

部署环境的服务器配置了单页应用（SPA）的 fallback 规则，当请求不存在的 /robots.txt 时，服务器没有返回标准的404状态码，而是直接返回了Angular的index.html文件。Lighthouse检测时会自动请求robots.txt，拿到index.html的内容后，会将其当作robots.txt解析，自然会报格式错误。本地开发环境（ng serve）不存在这个配置，所以不会出现该问题。

解决方案 #

方案1：修正服务器配置（推荐） #

修改部署服务器的配置，让请求/robots.txt时，若文件不存在则返回404状态码，而非index.html。

以Nginx为例，在站点配置中添加以下规则：

# 单独处理robots.txt请求，不存在则返回404
location = /robots.txt {
    try_files $uri =404;
}

这条规则会优先检查robots.txt文件是否存在，不存在则直接返回404，不会触发SPA的fallback逻辑。

方案2：添加空的robots.txt文件（快速临时方案） #

如果暂时无法修改服务器配置，可以手动创建一个空的robots.txt文件，放入Angular项目的src目录下，并确保构建时会将其复制到dist目录中。

1. 在项目根目录的src文件夹下创建空文件robots.txt
2. 打开angular.json，在projects -> [你的项目名] -> architect -> build -> options -> assets数组中添加"src/robots.txt"：

"assets": [
  "src/favicon.ico",
  "src/assets",
  "src/robots.txt"
]

构建项目后，dist目录下会包含这个空的robots.txt文件。Lighthouse检测时会请求到这个空文件，由于格式合法（只是没有任何规则），不会再报无效错误。

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