Mac Nginx 前端打包部署

安装homebrew

/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"

安装Nginx

brew install nginx

 nginx相关命令

nginx启动命令：nginx

nginx -s reload  #重新加载配置
nginx -s reopen  #重启
nginx -s stop    #停止
nginx -s quit    #退出
nginx -V         #查看版本，以及配置文件地址
nginx -v         #查看版本
nginx -c filename #指定配置文件
nginx -h #帮助

启动之后，在浏览器输入http://localhost:8080  或 http://127.0.0.1:8080/地址来打开nginx

前端打包

npm run build

之后会在dist文件夹中生成代码

前端部署

前往/usr/local/etc找到nginx.conf修改配置

http {

include mime.types;

default_type application/octet-stream;

sendfile on;

keepalive_timeout 65;

#root xxx/xxx配置项目路径，不配置的话默认是html文件夹

server {

listen 28866; //项目访问端口号

server_name localhost; //项目访问地址

location / {

try_files $uri $uri/ @router;#需要指向下面的@router 否则会出现vue 的路由在nginx 中刷新出现404

index index.html index.htm;

}

location @router {

rewrite ^.*$ /index.html last;

}

location /api/ { //【/api/ 】是nginx转发标识

proxy_buffer_size 64k;

proxy_buffers 32 32k;

proxy_busy_buffers_size 128k;

proxy_pass http://localhost:8880/api/tp/; //api服务器地址

proxy_redirect default;

}

error_page 500 502 503 504 /50x.html;

location = /50x.html {

root html;

}

}

进入/usr/local/Cellar/nginx/1.27.2/html，将打包的前端复制到 目录下

打开终端，使用nginx命令启动

打开浏览器访问 http://localhost:28866

完~