1.打包Vue项目,在项目路径下执行:
npm run build
打包完成后会在项目路径下生成dist文件夹
2.将dist文件夹上传至服务器上,如/usr/local/项目名称
3.编辑Nginx的配置文件:
location /项目名称 {
alias /usr/local/项目名称/dist;
try_files $uri $uri/ /index.html; //不加这一句,刷新404
}
//这里是vue的配置信息说明,不需要加在nginx配置文件,
/*
const router = new VueRouter({
mode: 'history',
base: '/项目名称', // 基础路径
routes
})
*/
//由于Vue项目中配置了以上基础路径,因此若想要/根路径能访问到,就需要增加
location / {
rewrite ^/(.*)$ /项目名称/$1 last;
}