vue-router中默认使用的是hash模式,url中会带有“#”,例如“http://localhost:3000/#/”,
这种情况我们遇到一个问题,就是服务端会在url后面补充参数,我需要拿到这个参数获取信息。
但是有这个“#”,url就变成了“ www.a.com/aaaa?c=1&b=2#¶ms=3”,客户端要用到params这个参数就拿不到了,如果想拿到就需要再处理一下“#”号。再有url上有个“#”也不太美观。
接下来就改了下vue-router的模式
export default new Router({
mode: 'history',
base:'/'//如果js和css跟html放在同级,这个也是要指定一下路径的。
})
改成‘history’模式,‘#’就去掉了,很开心。
然而打完包以后,页面是空白页。
然后有修改了下路径
把“assetsPublicPath”修改成你的js和css的路径,默认是“/”根路径,肯定是找不到资源的,也不会把资源放在根路径下。
我把js和css和图片这些静态资源放在cdn的,所以这个地方是一个绝对路径。所以router.js中的base去掉,否则在router调转的时候都会加上遗传base设置的路径。
如果“https://a.com”,调整“https://a.com/aa”
如果base设置了只,比如“/dist”,那你的url就变成了“https://a.com/dist/aa”
当然设置到这里还没有完,还需要你的服务端同事或者it同事设置一下ng
root /Users/qiilee/Desktop/vue/dist; 映射到172.20.x.x:128服务器。
至此就可以愉快的打开没有“#”号的url了。