1.Vue前端构建
➜ npm run build
构建成功后基本会在配置的dist文件下生成静态html文件。
2.生成的静态代码上传到服务器
把生成目录dist
里的文件打包上传至服务器(192.168.234.97)
➜ scp ./dist.zip root@192.168.234.97:/opt/www/vue-base
输入服务器登录密码。
上传到服务器静态地址
➜ /opt/www/vue-base
3.解压 dist.zip
➜ unzip dist.zip
4.Nginx 配置
Nginx 安装目录
➜ cd /opt/software/nginx
进入Nginx安装目录,修改 Nginx 的配置文件:
➜ vim conf/nginx.conf
修改如下:root 映射到静态代码文件夹:
location / {
#root html;
root /opt/www/vue-base/dist;
index index.html index.htm;
}
5.启动Nginx
进入Nginx安装目录,执行命令:
➜ ./nginx
重启Nginx
➜ ./nginx -s reload