现象:能加载到打包后的线上index.html 对应页面内容不显示
解决思路:nginx 配置优先使用路由( try_files 和 autoindex配置),不自动指向index.html
nginx 配置:
location /react {
alias /project/react/;
# browserHistory模式 404问题
try_files $uri $uri/ /react/index.html;
index index.html;
autoindex on;
gzip on;
add_header Access-Control-Allow-Origin '*';
add_header Access-Control-Allow-Methods 'GET, POST, PUT, OPTIONS';
add_header Access-Control-Expose-Headers 'Accept-Ranges, Content-Encoding, Content-Length, Content-Range';
}
核心代码:
try_files $uri $uri/ /react/index.html;
如果不行,设置下 webpack.config.js 前端代码:
//webpack.config.js 文件
devServer {
historyApiFallback: true
}
如此完结,根据实际项目上线遇到和解决办法