nuxt專案發布 部署

如何將nuxt專案進行發布部署

命令描述

nuxt

啟動乙個熱載入的web伺服器(開發模式) localhost://3000

nuxt build

利用webpack編譯應用，壓縮js和css(發布用)

nuxt start

以生產模式啟動乙個web伺服器（需要先執行nuxt build）

nuxt generate

編譯應用，並依據路由配置生成對應的html檔案(用於靜態文件部署)

可以將 命令加入到package.json中

執行npm run build進行打包

打包之後生成.nuxt目錄及下的dist目錄

驗證打包結果，npm run start

配置host + port

壓縮發布包

把發布包傳到服務端：可以用git等很多方式，

解壓安裝依賴

啟動服務

可以在nuxt.config.js中增加執行服務的配置

server:

,

.nuxt

static

nuxt.config.js

package.json

package-lock.json

使用壓縮工具壓縮

可以使用ssh 登入

例如 ssh root@遠端伺服器位址
輸入密碼
建立檔名 mkdir realworld-nuxtjs
切換路徑 cd realworld-nuxtjs
顯示目錄 pwd
使用scp命令傳輸到遠端伺服器
scp .\realworld-nuxtjs.zip root@位址:
// 剛才pwd的路徑
重新登入伺服器
切換到資料夾，找到上傳的壓縮檔案
使用 unzip realworld-nuxtjs.zip
使用 npm i 安裝依賴
使用 npm run start啟動專案

使用pm2是管理node.js程序的應用

安裝：npm install --global pm2

啟動： pm2 start 指令碼路徑

在伺服器使用

npm install --global pm2

啟動pm2 start 對應的指令碼

pm2 start npm --start

重新整理之前頁面，是否正常

傳統的部署方式

更新

本地構建
發布更新 本地構建
發布...
..

一共四個平台：本地，git遠端，ci/cd服務，web伺服器

環境準備

配置github access token 操作github的許可權

生成：

配置到專案的secrets中:

生成新的token，選擇token許可權，選擇repo的所有，確定生成

在setting 的secrets中 新建 new secret,name是token，value是剛才的token

可以參考

或者

nginx部署nuxt多專案

一 背景 之前使用nginx部署了乙個nuxt的專案，參考的是這篇文章nuxt專案的部署，現在部署多專案，先參考的是這篇文章nginx配置多個專案 使用nginx要在同乙個網域名稱下配置多個專案有兩種方式 nginx按不同的目錄分發給不同的專案 啟用二級網域名稱，不同的專案分配不同的二級網域名稱 採...

在docker中發布nuxt專案

dockerfile，使用阿里的npm源 建立前，我準備使用阿里的映象源，需要修改一下docker的環境。新增乙個配置檔案 sudo vi etc docker daemon.json 錄入以下內容 當然你也可以用中科院的 重啟docker。systemctl daemon reload syste...

nuxt線上打包發布

差了很多資料，吧自己的經驗總結一下 vue init nuxt community starter template 進行搭建的！選擇那個檔案檔案上傳到伺服器上去？我的伺服器檔案 啟動服務前先要修改package.json配置 我ngixn 是5656埠，這裡啟動應該是5656埠 scripts 啟...