React Router v7应用部署Hostinger遇阻：缺失index.html文件

1. 为什么没有index.html？ #

你当前用的react-router-serve是面向SSR/SSG的工具，构建后生成的server目录是服务端渲染入口，client是静态资源，但默认不会生成CSR（客户端渲染）所需的单页入口index.html——因为当前构建配置是为SSR设计的，而Hostinger共享主机不支持运行自定义Node.js服务端进程。

2. 能不能用build/server/index.js部署？ #

不行。Hostinger共享主机的基础套餐不允许运行自定义Node.js服务（react-router-serve需要启动Node进程才能工作），只有部分高级套餐或云主机支持Node.js部署，所以这条路走不通。

3. 必须转为CSR部署吗？ #

是的，这是共享主机部署React单页应用的唯一可行方案。调整步骤如下：

步骤1：修改配置生成CSR的index.html #

• 确保项目路由用的是BrowserRouter（客户端路由），而非SSR相关的路由组件。
• 替换当前的build命令，取消react-router-serve的使用，改用框架原生构建命令：
  • Create React App项目："build": "react-scripts build"
  • Vite项目："build": "vite build"
    执行npm run build后，会在build（或dist）目录下生成index.html和所有静态资源。

步骤2：上传静态文件到Hostinger #

把build/dist目录下的所有文件（包括index.html）直接上传到Hostinger的public_html目录。

步骤3：配置.htaccess处理路由重定向 #

因为React Router是客户端路由，直接刷新非根路径会返回404，需要在public_html下创建.htaccess文件，写入以下内容：

RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

这个配置会把所有非静态文件的请求重定向到index.html，让React Router接管路由逻辑。

4. 验证部署 #

上传完成后访问你的域名，应用应该能正常加载，刷新任意路由也不会出现404错误。

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