如果部署后,React BrowserRouter的Route不起作用,有几个可能的解决方法。以下是一些常见的解决方法和代码示例:
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', function(req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(3000, function() {
console.log('Server is running on port 3000');
});
上述代码将服务器配置为使用express.static中间件提供静态文件,并在所有路由上返回index.html。这将确保当访问React应用程序中的任何路由时,都会正确加载index.html文件。
import React from 'react';
import { BrowserRouter, Route } from 'react-router-dom';
const App = () => (
);
export default App;
上述代码中,basename的值设置为process.env.PUBLIC_URL,这将确保在部署时使用正确的URL路径。
import React from 'react';
import { HashRouter, Route } from 'react-router-dom';
const App = () => (
);
export default App;
上述代码中,将BrowserRouter替换为HashRouter,并重新导入相应的组件。
通过尝试以上方法,应该能够解决部署后React BrowserRouter Route不起作用的问题。