在Render部署React静态页面遇RollupError路径解析问题求助

1. 文件名大小写不匹配 #

部署服务器（Render、GitHub Pages基于Linux）默认区分文件名大小写，但本地Windows/macOS系统通常不区分。比如你在index.jsx里写import App from "./app.jsx"，但实际文件是App.jsx，本地能正常解析，服务器却会因找不到文件触发Could not resolve错误。

2. 路径配置错误 #

• Vite项目：检查vite.config.js中的base字段，如果部署到子路径（比如GitHub Pages的username/repo路径），必须设置base: "/你的仓库名/"；如果是Render根域名部署，设为"/"即可。配置错误会导致静态资源路径失效，出现空白页或模块解析失败。
• CRA项目：在package.json中添加"homepage": "."（适配任意路径）或对应部署的完整路径，否则构建后的资源会指向根域名，子路径下无法加载。

3. 部署目录配置错误 #

Vite默认构建产物在dist文件夹，CRA在build文件夹。Render部署时要在"Publish Directory"中指定对应目录；GitHub Pages部署时，要确保构建产物被正确推送，或通过Actions配置指定输出目录。目录选错的话，服务器找不到编译后的文件，会出现模块缺失或空白页。

4. Node版本环境差异 #

本地和部署环境的Node版本不一致，可能导致依赖安装或构建过程出现隐性错误，比如部分依赖包在特定版本下编译异常，导致构建产物缺失文件。可以在项目根目录添加.nvmrc文件指定Node版本，让部署环境和本地保持一致。

5. 导入路径拼写错误 #

再仔细核对index.jsx中App.jsx的导入路径：是否层级错误（比如多写../或少写src/）、扩展名写错（比如.js和.jsx混淆，且构建工具未配置自动解析扩展名）。这类细节错误容易被忽略，却会触发解析失败。

内容的提问来源于stack exchange，提问作者Siva Swathi Vasagar