React项目配置homepage后生产环境报Unexpected token '<'错误

问题本质 #

你遇到的Unexpected token '<'错误，核心原因是服务器把静态JS文件的请求返回了HTML内容。配置homepage后，build产物里的资源引用路径都带上了/nemouneh/前缀，但默认用serve -s build启动时，服务器没有正确映射这个子路径，导致所有/nemouneh/开头的资源请求都被重定向到index.html，浏览器把HTML当成JS解析就会触发语法错误。

解决步骤 #

1. 修正homepage配置 #

确保package.json里的homepage使用正确的子路径格式：

"homepage": "/nemouneh/"

注意：不要用不带开头斜杠的"nemouneh/"，也不要用不完整的URL格式"https:mysite/nemouneh/"。

2. 启动serve时指定路径前缀 #

启动serve时添加--prefix参数，让服务器将/nemouneh/前缀的请求映射到build文件夹：

serve -s build --prefix /nemouneh

如果需要指定端口，可追加-l参数（例如指定3000端口）：

serve -s build -l 3000 --prefix /nemouneh

3. 可选：用配置文件简化启动流程 #

如果不想每次启动都手动加参数，可在项目根目录创建serve.json文件，内容如下：

{
  "rewrites": [
    { "source": "/nemouneh/**", "destination": "/index.html" }
  ],
  "public": "/nemouneh"
}

之后直接运行serve -s build即可完成正确映射。

验证方式：启动后访问http://localhost:3000/nemouneh，静态资源会正确加载，错误不再出现。

内容的提问来源于stack exchange，提问作者رضا پریور