<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • Linux CentOS + Nodejs + Express部署vue項(xiàng)目

          2021-5-8    前端達(dá)人

          注:服務(wù)器為CentOS 7.3.1611,使用Xshell6 + Xftp6工具完成服務(wù)器遠(yuǎn)程操作

          一、安裝Node環(huán)境

          通過Xshell連接服務(wù)器成功之后就可以開始以下工作

          1.清理工作

          如果之前有安裝過nodejs,用自帶的包管理命名先刪除一次
          yum remove nodejs npm -y 
          
          • 1

          然后手動(dòng)進(jìn)入以下目錄刪除相關(guān)文件
          進(jìn)入 /usr/local/lib 刪除所有 node 和 node_modules文件夾
          進(jìn)入 /usr/local/include 刪除所有 node 和 node_modules 文件夾
          進(jìn)入 /usr/local/bin 刪除 node 的可執(zhí)行文件

          2.去官網(wǎng)復(fù)制node安裝包鏈接

          https://nodejs.org/en/download/在這里插入圖片描述

          3.在Xshell里cd到安裝目錄

          cd /usr/local/ 
          
          • 1

          4.輸入命令鏈接開始下載nodejs安裝包

          wget https://nodejs.org/dist/v10.16.0/node-v10.16.0-linux-x64.tar.xz 
          
          • 1

          5.輸入命令兩步解壓

          xz -d node-v10.16.0-linux-x64.tar.xz
          tar -xvf node-v10.16.0-linux-x64.tar 
          
          • 1
          • 2

          6.重名解壓的文件夾名稱為nodejs

          mv node-v10.16.0-linux-x64 nodejs 
          
          • 1

          7.進(jìn)入解壓目錄

          cd nodejs 
          
          • 1

          8.創(chuàng)建軟連接

          ln -s /usr/local/nodejs/bin/node /usr/local/bin/node
          ln -s /usr/local/nodejs/bin/npm /usr/local/bin/npm 
          
          • 1
          • 2

          如果不小心輸錯(cuò)了路徑,重新創(chuàng)建會(huì)提示:‘ln: 無法創(chuàng)建符號(hào)鏈接"/usr/local/bin/npm": 文件已存在’,輸入rm /usr/local/bin/npm命令清除后可以重新創(chuàng)建

          9.測(cè)試

          node -v
          npm -v 
          
          • 1
          • 2

          10.安裝cnpm淘寶鏡像并創(chuàng)建軟鏈接

          npm install -g cnpm
          ln -s /usr/local/nodejs/bin/cnpm /usr/local/bin/cnpm 
          
          • 1
          • 2

          二、用Express搭建web服務(wù)

          1.在Xshell里cd到指定目錄

          cd /var/www/ 
          
          • 1

          注:如果沒有www目錄就在var目錄下輸入命令mkdir www手動(dòng)創(chuàng)建一個(gè),并進(jìn)入到www目錄

          2.創(chuàng)建web服務(wù)項(xiàng)目文件夾

          mkdir demo 
          
          • 1

          3.cd進(jìn)入項(xiàng)目目錄

          cd demo 
          
          • 1

          4.初始化項(xiàng)目生成package.json

          npm init -y 
          
          • 1

          注:這里的-y意思是省略創(chuàng)建過程中一直輸yes的步驟

          5.安裝express

          cnpm i express -D 
          
          • 1

          6.創(chuàng)建web服務(wù)程序文件app.js

          mkdir app.js 
          
          • 1

          7.編寫web服務(wù)程序代碼app.js

          const fs = require('fs'); //文件模塊 const path = require('path'); //路徑模塊 const express = require('express'); //express框架模塊 const app = express(); const hostName = '11.22.33.44'; //ip const port = 9999; //端口 app.use(express.static(path.resolve(__dirname, './dist'))); // 設(shè)置靜態(tài)項(xiàng)目訪問路徑(此處的dist為webpack打包生成的項(xiàng)目文件夾名稱) app.get('*', function(req, res) { const html = fs.readFileSync(path.resolve(__dirname, './dist/index.html'), 'utf-8'); // 設(shè)置所有訪問服務(wù)請(qǐng)求默認(rèn)返回index.html文件 res.send(html); }); app.listen(port, hostName, function() { console.log(`服務(wù)器運(yùn)行在http://${hostName}:${port}`); }); 
          
          • 1
          • 2
          • 3
          • 4
          • 5
          • 6
          • 7
          • 8
          • 9
          • 10
          • 11
          • 12
          • 13
          • 14
          • 15
          • 16
          • 17
          • 18

          三、打包部署vue項(xiàng)目

          1.在本地開發(fā)工具里打包需要部署的vue項(xiàng)目

          npm run build 
          
          • 1

          生成的dist文件夾就是我們需要部署到服務(wù)器上的項(xiàng)目
          在這里插入圖片描述

          2.把dist文件夾通過Xftp工具復(fù)制到服務(wù)器的var/www/demo目錄下

          11160623264.png)

          四、啟動(dòng)web服務(wù)

          1.在Xshell里cd到var/www/demo目錄,輸入以下命令啟動(dòng)web服務(wù)程序

          node app.js 
          
          • 1

          如果能正常訪問項(xiàng)目地址表示已經(jīng)搭建成功。

          請(qǐng)求后端接口跨域方案請(qǐng)見:
          跨域代理方案1Nginx使用教程
          跨域代理方案2Nodejs 中使用http-proxy-middleware實(shí)現(xiàn)代理跨域

          2.安裝PM2托管Node Web服務(wù)程序

          在xshell里用node默認(rèn)的啟動(dòng)方式有一個(gè)缺點(diǎn),xshell退出后nodejs項(xiàng)目便會(huì)停止
          使用pm2這個(gè)托管工具可以很好的解決這個(gè)問題,而且當(dāng)代碼有更改時(shí)會(huì)自動(dòng)重啟服務(wù)更新

          1.首先多按兩次ctrl +c結(jié)束之前的運(yùn)行程序,接著輸入下面的命令安裝pm2并創(chuàng)建軟鏈接

          cnpm install pm2 -g
          ln -s /usr/local/nodejs/bin/pm2 /usr/local/bin/pm2 
          
          • 1
          • 2

          2.然后輸入下面的命令啟動(dòng)托管任務(wù),abc為托管項(xiàng)目定義的名稱

          pm2 start app.js --name abc 
          
          • 1

          以下為pm2常用命令說明

          命令 功能
          pm2 start app.js --name abc 啟動(dòng)(--name為定義任務(wù)名稱的指令,abc為任務(wù)名稱值)
          pm2 start app.js --watch 啟動(dòng)( --watch為監(jiān)聽?wèi)?yīng)用目錄的變化的指令)
          pm2 restart app.js 重啟任務(wù)
          pm2 stop abc 結(jié)束(abc為任務(wù)名稱或id)
          pm2 list 查看所有任務(wù)列表

          pm2基本功能命令

          功能 命令
          啟動(dòng)進(jìn)程/應(yīng)用 pm2 start bin/abc 或 pm2 start app.js
          重命名進(jìn)程/應(yīng)用 pm2 start app.js --name abc
          添加進(jìn)程/應(yīng)用 pm2 start bin/abc --watch
          結(jié)束進(jìn)程/應(yīng)用 pm2 stop abc
          結(jié)束所有進(jìn)程/應(yīng)用 pm2 stop all
          刪除進(jìn)程/應(yīng)用 pm2 delete abc
          刪除所有進(jìn)程/應(yīng)用 pm2 delete all
          列出所有進(jìn)程/應(yīng)用 pm2 list
          查看進(jìn)程/應(yīng)用詳情 pm2 show abc 或 pm2 describe abc
          查看進(jìn)程/應(yīng)用資源消耗 pm2 monit
          查看進(jìn)程/應(yīng)用日志 pm2 logs abc
          查看所有進(jìn)程/應(yīng)用日志 pm2 logs
          重新啟動(dòng)進(jìn)程/應(yīng)用 pm2 restart abc
          重新啟動(dòng)所有進(jìn)程/應(yīng)用 pm2 restart all

          pm2使用教程參考鏈接:
          https://www.cnblogs.com/chyingp/p/pm2-documentation.html
          https://www.jb51.net/article/113398.htm



          轉(zhuǎn)自:csdn。作者:lihefei_coder



          藍(lán)藍(lán)設(shè)計(jì)m.sdgs6788.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)



          日歷

          鏈接

          個(gè)人資料

          存檔

          亚洲精品美女久久777777| 精品无码久久久久久久动漫| 武侠古典久久婷婷狼人伊人| 综合久久精品色| 久久精品视频网| 欧美日韩精品久久久免费观看| 久久最新精品国产| 久久A级毛片免费观看| 一本久久免费视频| 2021精品国产综合久久| 亚洲AV日韩精品久久久久久| 久久综合狠狠综合久久激情 | 美女久久久久久| 久久久久久国产a免费观看不卡| 精品多毛少妇人妻AV免费久久| 中文字幕日本人妻久久久免费 | 伊人色综合久久天天| 久久精品国产2020| 亚洲AV无码久久精品成人| 久久久噜噜噜久久| 亚洲国产成人久久精品影视 | 奇米影视7777久久精品人人爽| 久久精品夜夜夜夜夜久久| 久久精品国产免费观看| 国产精品久久自在自线观看| 久久久久人妻一区二区三区 | 亚洲欧美国产日韩综合久久| 精品国产乱码久久久久久浪潮| 久久国产乱子伦精品免费强| 精品久久久久久中文字幕人妻最新| 狠狠色婷婷久久一区二区| 久久综合日本熟妇| 国产精品久久久久久久人人看 | 久久久精品日本一区二区三区 | 久久99免费视频| 亚洲嫩草影院久久精品| 日本五月天婷久久网站| 久久久久一本毛久久久| 午夜精品久久影院蜜桃| 久久精品日日躁夜夜躁欧美| 国产成人精品综合久久久久|