最近在做nuxt項目的開發,毫無疑問的遇到了部署的問題,對於nuxt小白的我以為和客戶端項目那樣打包編譯上傳前端服務器就完事了,然而並不是這樣的。從部署到更新部署將流程和遇到的問題的解決方法記錄一下:
1.對nuxt項目進行打包編譯,輸入指令npm run build,執行完會出現.nuxt文件夾,再執行npm run start,在瀏覽器輸入localhost://3012(我的端口號是3012,這端口號輸入自己項目的端口號),如果能夠正常訪問說明打包沒問題。
2.將.nuxt,static,nuxt.config.js,package.json這四個文件夾復制上傳到前端服務器,我用的是winSCP,在winSCP有個終端命令,在部署的文件夾下打開終端命令窗口,輸入npm install點擊執行,遠端會進行依賴安裝,安裝完成后文件夾會出現node_modules文件夾,此時准備工作已完成,在終端命令窗口輸入npm run start點擊執行,Nginx配置好后通過域名就能正常將項目跑起來。此時可以不走紅色背景那個命令,采用pm2守護進程,即輸入pm2 start npm --name "xxxxxx" -- run start(xxxxxx是服務器當前項目文件夾的名稱),這樣就能讓項目持續運行,這里不多描述,大家可以自行查一下pm2,執行完可以看到自己的項目是處於‘online’狀態,說明是在線的,Nginx配置好后通過域名就能正常將項目跑起來。
3.當項目之前部署是成功的,在進行版本優化迭代時,像客戶端項目那樣打包編譯直接上傳刷新頁面就更新成功了。而這個做法用在nuxt更新部署上時你會發現是行不通滴,npm run start會給你報錯,提示端口始終存在。又或者部署后頁面無法打開提示Server error等等。在反復折騰后發現應該這樣做:
由於我是自己摸索的,從而pm2列表有多個進程是重復的,包括端口占用等。先進行以下處理:
(1)終端窗口輸入pm2 delete xx(xx是守護列表里項目的id)可以清理多余的進程守護。
(2)終端窗口輸入netstat -nultp可以查詢端口使用情況,netstat -anp | grep xxxx(xxxx是端口號)可以查找占用端口的進程,kill -9 xxxxx(xxxxx是進程id)可以殺死占用進程。
(3)將多余進程清理,端口占用清理后輸入npm run start執行,此時你會看到終端不再提示你的端口始終存在。
此時進行下列操作:
(1)終端窗口輸入pm2 stop xx(xx是守護列表里項目的id),將pm2進程守護停止(沒有停止守護時重復執行第2步操作,你會發現pm2的list會有很多守護項)。
(2)將重新打包的四個文件夾上傳(若node_modules被刪除或者有新的依賴時,需要在終端窗口輸入npm install)。
(3)在終端窗口輸入pm2 restart xx(xx是守護列表里項目的id),刷新頁面就能看到頁面正常運行了。
以上就是nuxt部署的步驟以及我遇到問題時的解決辦法,親測有效,希望能幫到大家。
如需轉載請注明出處:https://www.cnblogs.com/zishang91/p/14918515.html,以便有錯誤可以及時修改,若有錯漏不足之處,請見諒並且指點,謝謝!!!