1、在对应的多页目录下的router.js配置history
const router = new Router({
base: '/mobile/share',
mode: 'history',
},
注:router里面的base属性是项目部署服务器的目录路径,例如你的项目访问路径是www.xxx.com/mobile/share
2、在vue.congig.js添加代码
configureWebpack: {
devServer: {
historyApiFallback: {
verbose: true,
rewrites: [
{ from: '/xx', to: '/yy.html'}
]
}
}
},
注:from指你多页中进入其中一个页面index的路由路径,to表示重写到yy.html 至于多页配置自行搜索,注意的是修改vue.config.js需要重新启动才会生效。
3、重启输入localhost:8080/xx就可以访问到yy.html的代码
补充:如果部署到nginx服务器,发现报404,就需要nginx部署修改下代码
location / {
root /software/vue/dist;
index index.html;
try_files $uri $uri/ /index.html;
}
location /xx {
root /software/vue/dist;
index yy.html;
try_files $uri $uri/ /yy.html;
}
root:项目dist下面的文件部署的根目录