Bootstrap CSS可访问但Source Map报404错误：原因及解决方法

错误原因 #

你遇到的是Source Map文件404错误，核心和CSS文件本身无关（CSS可正常访问），问题出在source map相关环节：

• 缺失对应的bootstrap.min.css.map文件：bootstrap.min.css代码末尾有注释指定了source map文件，但服务器对应目录里没有这个文件
• source map路径错误：CSS里的source map路径配置有误，浏览器按错误路径查找文件导致404
• 服务器限制：服务器可能禁止访问.map后缀文件，或该文件权限设置不正确

修复方法 #

• 补充缺失的source map文件
  下载与当前bootstrap.min.css版本完全一致的bootstrap.min.css.map文件，上传到服务器上和bootstrap.min.css相同的目录（即https://www.domain123.com/wp-content/themes/gogo-theme/css/）
• 移除source map引用
  打开服务器上的bootstrap.min.css文件，找到末尾类似/*# sourceMappingURL=bootstrap.min.css.map */的注释行，直接删除该行
• 修正source map路径
  如果bootstrap.min.css.map放在其他目录，修改CSS文件末尾的sourceMappingURL值为正确的相对路径或绝对路径
• 调整服务器配置
  检查服务器文件权限，确保bootstrap.min.css.map有可读取权限；同时确认服务器没有拦截.map后缀文件的访问规则

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