React项目部署Heroku报错：无法解析'-/firebase-config'模块

问题描述 #

我尝试将React项目部署到Heroku平台，但向Heroku master分支推送文件时，构建因报错“Module not found: Error: Can't resolve '-/firebase-config' in '/tmp/build_0de13186/src'”失败。请问该如何重新添加/恢复这个缺失的模块？它是本地缺失还是远程缺失？我的React项目包含服务端和客户端，二者位于同一根目录下，且各自的package.json中均已安装firebase。

报错日志 #

remote: -----> Build
remote:        Running build
remote:        
remote:        > fullstackapp@0.1.0 build
remote:        > react-scripts build
remote:        
remote:        Creating an optimized production build...
remote:        Failed to compile.
remote:        
remote:        Module not found: Error: Can't resolve '-/firebase-config' in '/tmp/build_0de13186/src'
remote:        
remote:        
remote: 
remote: -----> Build failed
remote:        
remote:        We're sorry this build is failing! You can troubleshoot common issues here:
remote:        https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:        
remote:        Some possible problems:
remote:        
remote:        - Node version not specified in package.json
remote:          https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
remote:        
remote:        Love,
remote:        Heroku
remote:        
remote:  !     Push rejected, failed to compile Node.js app.
remote: 
remote:  !     Push failed
remote:  !
remote:  ! ## Warning - The same version of this code has already been built: b577f7b18ab92dd19ec0a6e615586f97af15d9f6
remote:  !
remote:  ! We have detected that you have triggered a build from source code with version b577f7b18ab92dd19ec0a6e615586f97af15d9f6
remote:  ! at least twice. One common cause of this behavior is attempting to deploy code from a different branch.
remote:  !
remote:  ! If you are developing on a branch and deploying via git you must run:
remote:  !
remote:  !     git push heroku <branchname>:main
remote:  !
remote:  ! This article goes into details on the behavior:
remote:  !   https://devcenter.heroku.com/articles/duplicate-build-version
remote: 
remote: Verifying deploy...
remote: 
remote: !       Push rejected to fullstackapp-portfolio.
remote: 
To https://git.heroku.com/fullstackapp-portfolio.git
 ! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/fullstackapp-portfolio.git'

解决方案 #

1. 缺失原因判断 #

这不是本地或远程缺失firebase包的问题，而是你的代码里存在错误的路径引用：'-/firebase-config'这个格式既不是合法的npm包名，也不是正确的文件路径，导致Heroku构建时找不到对应文件。

2. 修复步骤 #

• 定位错误引用：在本地项目的src目录下全局搜索'-/firebase-config'，找到所有使用该路径的import/require语句。
• 修正路径格式：去掉路径开头的-，改成正确的相对路径。比如：
  • 如果firebase-config.js在src根目录：import firebase from './firebase-config'
  • 如果在src/config子目录：import firebase from './config/firebase-config'
    注意：服务端和客户端的代码都要检查，确保两边的引用路径都正确。
• 本地验证构建：执行npm run build（或yarn build），确认本地能正常编译通过。
• 重新推送代码：提交修复后的代码到本地git仓库，再推送到Heroku：

  git add .
  git commit -m "fix: 修正firebase-config路径引用错误"
  git push heroku master
  

额外说明 #

Heroku提示的重复版本警告是因为你推送了相同的代码版本，修复错误后提交新的commit就能解决该问题。

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