Vue-router+webpack单页项目服务器部署(nginx)

vue

部署项目目录结构如下:


1.首先修改config文件夹下的index.js 配置文件,将文件内的assetsPublicPath: '/'修改为 assetsPublicPath: './'



2.在router文件夹下的index.js路由配置中加上:
mode: 'history', // 路由模式,此处为history模式,需修改nginx配置文件
base: '/', // 路由基目录


3.命令行执行npm run build 生成布署文件,并将文件上传到服务器


4.修改nginx的配置文件(mode为history模式)
根据官方文档nginx只需在nginx.conf配置文件里加入 try_files $uri $uri/ /index.html;重启服务器即可。


我的nginx配置文件如下:


项目访问主页面:


项目访问子页面:


以上是 Vue-router+webpack单页项目服务器部署(nginx) 的全部内容, 来源链接: utcz.com/z/376022.html

回到顶部