---

一、Node中node_modules文件夾及package.json文件的作用說明

node_modules是安裝node后用來存放用包管理工具下載安裝的包的文件夾，更多細(xì)節(jié)請見以下鏈接：

Node中node_modules文件夾及package.json文件的作用說明

運行npm install命令的時候會發(fā)生什么？

在VUE3項目的工程目錄中，通過以下命令可生成node_modules文件夾。

npm install

下面，我們將從VUE3項目打包和Windows Server上的Nginx部署兩個方面描述Windows server上用nginx部署vue3項目的整個過程。

二、VUE3項目打包

VUE3項目的打包命令是：

（1）安裝Nodejs。點擊 Nodejs可跳轉(zhuǎn)至Nodejs的官方下載地址。

（2）進入VUE3項目的工程目錄（如下圖所示），同時按住“Shift + 鼠標(biāo)右鍵”，在彈出的菜單中選擇“在此處打開Powershell窗口”選項。

如此便進入了Powershell命令行界面，如下圖所示。

我們可以執(zhí)行以下命令（前端打包命令），對該VUE3項目進行打包。

npm run build

這里同樣補充了一些npm常用命令：

1. 前端筆記(2) npm常用命令總結(jié)

這時，出現(xiàn)以下錯誤提示：Vite不是內(nèi)部或外部命令，也不是可運行的程序。

通過查閱資料，繼續(xù)執(zhí)行以下命令：

npm install -g vite

再次執(zhí)行打包命令，

npm run build

還是報錯，錯誤信息如下圖所示。

（3）通過以下命令來更新packages，

npm i

之后，再用npm run build來打包，顯示成功，如下圖所示。

（4）打包完成后，在該工程的目錄中會生成一個名為dist的文件夾，里面有形成需要部署的文件。

---

三、Windows Server上的Nginx部署

點擊 Nginx可跳轉(zhuǎn)至Nginx的官方下載地址。

在Nginx安裝包目錄中，可以通過以下命令啟動Nginx服務(wù)：

start nginx.exe  //啟動
nginx.exe -t    //檢查配置文件是否有錯
nginx.exe -s reload    //更新配置文件
nginx.exe -s stop    //快速關(guān)閉nginx,不建議使用
nginx.exe -s quit    //等待工作進程處理完成后關(guān)閉

這里，nginx給出以下錯誤信息：
Windows：nginx: [error] CreateFile() “/logs/nginx.pid“ failed (2: The system）

經(jīng)分析，造成上述錯誤的本質(zhì)原因是：后臺開啟了太多nginx進程。因此，通過“Windows任務(wù)管理器”，關(guān)閉過多的nginx進程就可以解決該問題。

其它錯誤：
Windows環(huán)境搭建nginx出現(xiàn)500的錯誤

CSDN上一個類似的帖子如下：

Windows：nginx: [error] CreateFile() “/logs/nginx.pid“ failed (2: The system）

---

? 【彩蛋來了】

看完作者寫的這篇博文，請參見：

1. windows server 用nginx部署vue3項目

2. 使用Nginx部署Vue項目全過程及踩坑記錄

3. Nginx 配置詳解

4. Vue3+Vite3多項目Nginx部署

5. nginx 部署vue 3

6. Nginx之部署Vue3項目

created in 2023.08.03，updated in 2023.08.03