Linux部署Nuxt應(yīng)用一條龍

[TOC]

一、安裝環(huán)境

node版本是v8.11.3
npm版本是5.6.0
pm2版本3.3.2

1.安裝node環(huán)境,Linux 64bit version

wget https://nodejs.org/dist/v8.11.3/node-v8.11.3-linux-x64.tar.xz

下載之后,由于是tar.xz格式的壓縮文件,所以需要用下面的命令解壓:

xz -d **.tar.xz
tar -xv -f **.tar
//或者
tar -Jxv -f **.tar.xz(大寫(xiě)的J)

壓成功之后即是可以運(yùn)行的二進(jìn)制文件,只需要為node何npm建立兩個(gè)軟連接,使之可以全局運(yùn)行即可:

ln -s /you_path/node-v8.11.3-linux-x64/bin/node /usr/local/bin/node
ln -s /you_path/node-v8.11.3-linux-x64/bin/npm /usr/local/bin/npm

最后執(zhí)行node --version,顯示node版本號(hào)即為安裝成功:

node --version
v8.11.3

npm --version
5.6.0

安裝淘寶鏡像
執(zhí)行以下命令即可全局安裝cnpm。之后可以直接使用cnpm代替npm,命令格式是一樣,速度比npm快很多

npm install -g cnpm --registry=https://registry.npm.taobao.org
ln -s /you_path/node-v8.11.3-linux-x64/bin/cnpm /usr/local/bin/cnpm

2.安裝pm2
PM2是node進(jìn)程管理工具,可以利用它來(lái)簡(jiǎn)化很多node應(yīng)用管理的繁瑣任務(wù),如性能監(jiān)控、自動(dòng)重啟、負(fù)載均衡等,而且使用非常簡(jiǎn)單。

cnpm i pm2 -g
ln -s /you_path/node-v8.11.3-linux-x64/bin/pm2 /usr/local/bin/pm2
pm2 --version
3.2.2

二、nginx反向代理

先在nuxt項(xiàng)目配置文件中配置域名和端口

// nuxt.config.js
 server: {
    port: 3004, // default: 3000
    host: '0.0.0.0', // default: localhost,
  },

nginx監(jiān)聽(tīng)的端口與項(xiàng)目中的端口一致,在nginx的 vhost里新建一個(gè)主機(jī)綁定

upstream deju-pc-ssr {
    #nuxt項(xiàng)目 監(jiān)聽(tīng)端口與項(xiàng)目端口一致(76、251的docker環(huán)境要把127.0.0.1替換成服務(wù)器ip)
    server 127.0.0.1:3004;
    keepalive 64;
}

server {
    listen 443;
    server_name www.dighouse.com;

    location ~* ^/(aboutus|ershoufang|xinfang).*$ {
                 proxy_http_version 1.1;
                 proxy_set_header Upgrade $http_upgrade;
                 proxy_set_header Connection "upgrade";
                 proxy_set_header Host $host;
                 proxy_set_header X-Nginx-Proxy true;
                 proxy_cache_bypass $http_upgrade;
                 proxy_pass http://deju-pc-ssr; #反向代理
     }

     location ~* ^/(index|index.html)?/?$ {
                 proxy_http_version 1.1;
                 proxy_set_header Upgrade $http_upgrade;
                 proxy_set_header Connection "upgrade";
                 proxy_set_header Host $host;
                 proxy_set_header X-Nginx-Proxy true;
                 proxy_cache_bypass $http_upgrade;
                 proxy_pass http://deju-pc-ssr; #反向代理
      }
}

三、打包應(yīng)用

項(xiàng)目在本地完成后,npm run build 打包應(yīng)用,
打包完成后,我們將3個(gè)文件傳到服務(wù)器空間里/www.dighouse.com/deju-pc-ssr/, 需要上傳文件如下

.nuxt
nuxt.config.js
package.json

四、pm2開(kāi)啟進(jìn)程守護(hù)

進(jìn)入對(duì)應(yīng)的應(yīng)用目錄/www.dighouse.com/deju-pc-ssr/,執(zhí)行以下命令
1.安裝package里的依賴,只需要安裝一次

cnpm install

2.本地啟動(dòng)nuxt項(xiàng)目檢測(cè)是否報(bào)錯(cuò)

npm run start //查看 http://localhost:3002/

3.啟動(dòng)守護(hù)進(jìn)程

pm2 start npm --name "deju-pc-ssr" -- run start

其中deju-pc-ssr的名稱是 我們?cè)趐ackage中的項(xiàng)目名稱。
執(zhí)行完pm2的啟動(dòng)命令后,我們用 pm2 list 查看一下進(jìn)程列表

581452dd-21a6-4a73-b9b1-ef457b82380e.png

4.發(fā)布新版本代碼重啟守護(hù)進(jìn)程

pm2 restart deju-pc-ssr

五、pm2配置文件啟動(dòng),監(jiān)聽(tīng)文件變化自動(dòng)重啟

每次發(fā)布代碼去執(zhí)行命令重啟pm2進(jìn)程還是很麻煩,通過(guò)pm2配置文件啟動(dòng)服務(wù)可以監(jiān)聽(tīng)文件變化自動(dòng)重啟。

1.新建pm2配置文件
在服務(wù)器項(xiàng)目目錄中新建 pm2system.config.js文件,代碼如下:

// pm2system.config.js
module.exports = {
  apps: [
    {
      name: 'deju-pc-ssr',//項(xiàng)目名稱
      cwd: "./",// 當(dāng)前工作路徑
      script: 'npm',// 實(shí)際啟動(dòng)腳本
      args: "run start",//參數(shù)
      autorestart: true,
      watch: true,// 監(jiān)控變化的目錄,一旦變化,自動(dòng)重啟
      watch: [".nuxt", "nuxt.config.js"],// 監(jiān)控變化的目錄,一旦變化,自動(dòng)重啟
      watch_delay: 1000,
      ignore_watch: ["node_modules"],// 從監(jiān)控目錄中排除
      watch_options: {
        "followSymlinks": false,
        "usePolling": true,
      }
    }
  ],
};

2.啟動(dòng)pm2
如果之前服務(wù)啟動(dòng)過(guò)記得先刪除進(jìn)程pm2 delete deju-pc-ssr。
然后啟動(dòng)pm2配置文件

pm2 start pm2system.config.js

六、開(kāi)機(jī)自動(dòng)啟動(dòng)

我們希望直接通過(guò)服務(wù)器重啟之后能自動(dòng)啟動(dòng),可以通過(guò)pm2 startup來(lái)實(shí)現(xiàn)開(kāi)機(jī)自啟動(dòng)。細(xì)節(jié)可參考。流程如下:

  1. 通過(guò)pm2 save保存當(dāng)前進(jìn)程狀態(tài)。
  2. pm2 startup

參考

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容