一、vue项目打包
正常vue_cli脚手架打包命令: npm run build
vue-element-admin 项目 打包命令: npm run build:prod
[ 两句命令区别大概是后台框架需要指定打包的环境(test,dev,prod),具体的区别还不太清楚,
参考文章:vue-element-admin部署生产环境_CrazyZomble的博客-CSDN博客 ]
可能需要修改的配置参数:
1. env.production 文件中 VUE_APP_BASSE_API='接口地址'
2. vue.config.js 文件中
publicPath: '/',
outputDir: 'dist',
assetsDir: 'static'
二、nginx 部署
1. 把打包完成的vue项目dist 文件放到nginx安装路径下的html文件夹中
2. 修改nginx.conf 配置文件
server {
listen 80; // 端口
server_name localhost; // 本地IP
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root D:/software/nginx-1.17.10/html/dist; // 打包项目地址
try_files $uri $uri/ /index.html last; // 指向index.html
index index.html;
}
}
3. nginx 相关命令行
启动:start nginx
停止:nginx -s stop(不保存相关信息)
nginx -s quit(保存相关信息)
重启:nginx -s reload(保存相关信息)