项目由dva-cli创建
打包线上包:
npm run build
本地检查dist包(本人全局安装了http-server,所以直接启动,如果有自己server可以更换对应命令)
cd dist && http-server
检查OK没有问题,部署到服务器,注意本人没有部署到服务器根目录,而是部署到了一个二级目录下面
服务器是ngix服务器,所有服务对应有配置,要求所有资源指向都指向到dist/index.html里面,具体配置可以找服务端人员或者自己调试
server {
listen 80;
server_name www.example.com;
root /path/to/xx/dist;
location / {
index index.html index.htm;
try_files $uri $uri/ /index.html =404;
}
location * {
try_files $uri $uri/ /index.html =404;
}
}
然后访问地址:
https:// xxx.xxxx.com/dist/
发现打开后一片空白,页面也没有报错,如下图
然后有点懵逼了,配置了ngix代理了呀,本地打包测试也OK,这可咋整呢?
然后改为hash路由,再次上线服务器,然后访问,发现木有问题呀,那就不是代码问题了;怎么解决呢?
去dvajs的GitHub主页去找发现,也有人遇到相同问题,不过回答都不具体明细
我参考这个解决的https://github.com/dvajs/dva/issues/1650
解决办法一:
部署到服务器根目录;但是如果根目录是其他项目页面那么久没办法了,只有部署到二级目录了,二级目录久只有办法二了。
解决办法二:
因为使用的是 browserHistory ,默认 base 是 /
,所以访问 http://domain/dist,base 是 /dist
,所以匹配不上。
配置base如下:
import { createBrowserHistory as createHistory } from "history";
const app = dva({
history: createHistory({
basename: "/dist"
})
});
本人也通过办法二解决了,希望对大家有帮助!