一、homebrew安裝Nginx

1、安裝nginx，查看nginx安裝和配置路徑

• 安裝

brew install nginx

• 使用brew安裝完成后nginx的安裝路徑為

 /usr/local/Cellar/nginx

• 配置文件路徑為

/usr/local/etc/nginx/nginx.conf

2、查看nginx信息

brew info nginx

3、使用homebrew方式啟動和關閉nginx

• 啟動

brew services start nginx

• 重啟

brew services restart nginx

• 停止

brew services stop nginx

4、直接使用nginx啟動

• 啟動

sudo nginx

• 關閉
  • stop表示立即停止nginx,不保存相關信息
  • quit表示正常退出nginx,并保存相關信息

sudo nginx -s stop    或者    nginx -s quit

• 重新加載配置文件

sudo nginx -s reload

5、其他

• 查看nginx是否啟動，存在nginx:master即是啟動中的nginx進程號

ps -ef|grep nginx

• 這將使用默認配置文件啟動Nginx服務器。你可以使用以下命令測試Nginx服務器是否正在運行：

curl http://localhost:80

6、安裝并啟動成功

• 默認安裝后的端口號是80，可在/usr/local/etc/nginx/nginx.conf文件中查看

瀏覽器中訪問：http://localhost:80

• 啟動成功

  
  
  啟動成功.jpg

二、使用nginx配置啟動vue項目

1、打包vue項目

npm run build
把打包好的dist文件夾拷貝到nginx里的html文件夾下

/usr/local/Cellar/nginx/html/dist.jpg

2、修改nginx.conf配置文件

• 路徑： /usr/local/etc/nginx/nginx.conf

1）一個最簡單的示例--無反向代理

• 只修改server中的listen和location，其他使用默認配置
• 修改后可以直接使用http://localhost:8887 訪問vue項目

    server {
        listen       8887; #此處可修改訪問的端口號
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            # root   html;
            root /usr/local/Cellar/nginx/1.23.1/html/dist/; #此處必須替換為nginx下打包得到dits文件夾路徑
            index  index.html index.htm;
        }
    }

2）局域網設備對vue項目的訪問

• 終端輸入，查看ip地址

ifconfig | grep "inet"

ip地址.jpg

• 直接使用 192.168.xx.xxx:8030 可訪問

三、參考文章

如何在Mac上啟動NGINX