最近使用Vue和Koa2重構了自己的博客,過程中踩了不少坑,查了很多資料,最后總算成功上線。之后我計劃圍繞這個過程寫一系列文章,講講如何用Vue+Koa2寫一套網站。
而現在,先來講講最后一步,在寫完Vue和Koa2后,如何將它們部署到線上。
1.將Vue和Koa2結合
很多人在打完包后就不知道怎么做了,畢竟后面都是后端的事情。如果你用的是Vue-cli3.0,那么打包這一步會非常簡單,只需要執行一條命令即可,其它的不用關心:
npm run build
之后會生成一個dist的文件夾,將它放到Koa2目錄下的public文件里,然后在Koa2的配置文件app.js里將靜態資源指向這個文件夾,指向命令在我們創建Koa2框架時就已經自動生成,所以我們要做的也只是改一下文件地址就行了:
app.use(require('koa-static')(__dirname + '/public/dist'))
改好之后打開koa2的主頁,看看是否加載成功,第一步就愉快地完成了。
2.Nginx配置
現在登錄服務器,安裝完Nginx后,在`/etc/nginx/sites-enabled/`下新建一個conf文件,然后寫入配置:
//Koa的端口一般默認是3000upstream koa.server{ server 127.0.0.1:3000;}server { listen 80; server_name .******.com; location / { proxy_pass http://koa.server; proxy_redirect off; }}寫完之后重啟Nginx:
sudo /etc/init.d/nginx restart
接著將Koa2文件上傳到服務器,啟動后在瀏覽器里輸入你的網址或者服務器ip,能訪問到就大功告成了。
當然,這套Nginx配置還是非常簡陋,如果希望長期穩定運行的話還得加入SSL和Gzip,網上資料很多,如果以后有機會的話我也會講一下。
3.使用Pm2進行進程管理
能成功訪問后接著就是將Koa放到后臺運行,這里使用了Pm2進行管理,先來安裝:
npm install -g pm2
安裝好后在Koa目錄下創建一個文件 “pm2.conf.json”,然后輸入以下代碼:
{ "apps":{ "name":"blog", "script": "bin/www", "watch": true, "ignore_watch":[ "node_modules", "logs" ], "instances":2, "error_file":"logs/err.log", "out_file":"logs/out.log", "log_date_format": "YYYY-MM-DD HH:mm:ss" }}來重點說下兩個參數,watch和instances。
Watch是檢測到文件有改動會自動重啟加載,ignore_watch則是排除不需要監控的文件。
Instances則是開啟實例數,建議根據cpu核數進行配置,有多少核就開啟多少條。
最后啟動:
pm2 start pm2.conf.json
到這里,網站就部署完成了!
總結
以上所述是小編給大家介紹的Vue+Koa2 打包后進行線上部署的教程詳解,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!
如果你覺得本文對你有幫助,歡迎轉載,煩請注明出處,謝謝!
新聞熱點
疑難解答