如果在本地环境下React路由正常工作,但在Heroku上无法正常工作,可能是由于Heroku的服务器配置或路由设置不正确导致的。以下是一些可能的解决方法。
_redirects
的文件,并添加以下内容:/* /index.html 200
这将确保所有的请求都被重定向到index.html
文件,以便React路由能够正常工作。
package.json
文件中,确保homepage
字段的值正确指向项目的根路径。例如:"homepage": "https://your-app-name.herokuapp.com/"
setupProxy.js
的文件,并添加以下内容:const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
app.use(
'/api',
createProxyMiddleware({
target: 'http://your-api-url',
changeOrigin: true,
})
);
};
将your-api-url
替换为你的后端API的URL。
npm install react-router-dom
npm run build
然后将构建后的文件部署到Heroku上。
以上是一些常见的解决方法,希望能帮助你解决React路由在Heroku上无法正常工作的问题。如果问题仍然存在,请检查Heroku的日志或错误提示,以获取更多信息。