接上一篇：Vue優化策略_項目發布_01
https://gblfy.blog.csdn.net/article/details/105359879

文章目錄

• • 一、通過node創建web服務器
  • • 1. 創建文件夾
    • 2. 初始化包管理配置文件
    • 3. 安裝express插件
    • 4. 復制vue打包后dist
    • 5. 創建app.js+配置
    • 6. 運行項目并瀏覽器訪問
  • 二、開啟gzip配置
  • • 2.1. 安裝插件
    • 2.2. 配置插件
    • 2.3. 運行項目并瀏覽器訪問
  • 三、使用pm2管理應用
  • • 3.1. pm2常用命令
    • 3.2. 安裝pm2
    • 3.3. 使用pm2啟動項目
    • 3.4. 使用pm2 重新啟動項目
    • 3.5. 使用pm2 停止項目
    • 3.5. 使用pm2 刪除項目

一、通過node創建web服務器

1. 創建文件夾

mkdir web_server

2. 初始化包管理配置文件

#進入cd web_server npm init -y

3. 安裝express插件

npm i express -S

4. 復制vue打包后dist

將vue項目打包后的dist文件夾,復制到web_server目錄下面

5. 創建app.js+配置

#創建app.js echo "express" >> app.js

#配置如下

// 1.導入express const express = require('express') // 2.調用express函數返回得到一個web服務器 const app = express()// 3.注冊express中間件，并設置托管的靜態文件目錄 app.use(express.static('./dist'))// 4. 啟動服務器，默認端口80，并設置回調函數，當服務器啟動后輸出'server running at http://127.0.0.1' app.listen(80, () => {console.log('server running at http://127.0.0.1') })

6. 運行項目并瀏覽器訪問

node ./app.js

http://127.0.0.1

二、開啟gzip配置

使用gzip可以減小文件體積，使傳輸速度更快。

2.1. 安裝插件

npm i compression -S

2.2. 配置插件

// 1.導入compression const compression = require('compression') // 2.注冊并啟用compression中間件 // 一定要把這一行代碼，寫到 靜態資源托管之前 app.use(compression())

2.3. 運行項目并瀏覽器訪問

node ./app.js

http://127.0.0.1

在這里插入代碼片

三、使用pm2管理應用

3.1. pm2常用命令

功能命令

在服務器上安裝pm2	npm i pm2 -g
啟動項目	pm2 start 腳本 --name 自定義名稱
查看正在運行的項目	pm2 ls
重啟項目	pm2 restart 自定義名稱或者id
停止項目	pm2 stop 自定義名稱或者id
刪除項目	pm2 delete 自定義名稱或者id

3.2. 安裝pm2

npm i pm2 -g

3.3. 使用pm2啟動項目

#進入到web_server目錄下面，在終端終中執行以下命令： pm2 start ./app.js --name web_server

3.4. 使用pm2 重新啟動項目

#進入到web_server目錄下面，在終端終中執行以下命令： pm2 restart ./app.js --name web_server

3.5. 使用pm2 停止項目

#進入到web_server目錄下面，在終端終中執行以下命令： pm2 stop ./app.js --name web_server

3.5. 使用pm2 刪除項目

#進入到web_server目錄下面，在終端終中執行以下命令： pm2 delete ./app.js --name web_server

總結

以上是生活随笔為你收集整理的Vue优化策略_项目上线_02的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。