解放運維小哥哥，帶你本身上 Linux 部署項目

本文主要講不使用 nginx 如何部署前端項目，靜態頁面和 node 的項目一樣適用。下面的介紹中，暫時先沒有使用到 jenkins 去進行自動部署，就是本身登陸服務器進行操做的步驟。

本文可讓你學到什麼

寫這篇文章的目的是讓新手能夠自行登陸服務器進行前端項目部署，不須要依賴運維和後端，畢竟你們時間都有限，自力更生很重要。

具體操做步驟

登陸服務器

前提是你要有一臺能夠登陸的服務器哦，這個能夠和你的運維小哥哥申請，申請完成後，主要有三項東西比較重要，用戶名，密碼，服務器的 ip 和端口號。

在 Mac 上能夠直接使用命令行操做，window 上須要有登陸虛擬機的工具，這個自行百度吧，網上有不少。下面你看到的操做和截圖都是在 Mac 上進行。

在 iTerm2 中輸入一下命令進行服務器的登陸操做：

ssh username@ip:port
# username 是你登陸服務器的用戶名
# ip 是機器的ip
# port 是機器的端口號
複製代碼

接下來會讓你輸入密碼，輸入完成以後就登上本身的服務器咯。你確定會想，若是後續每次登陸都須要輸入密碼，是否是很煩，咱們能夠配置一個免密登陸，後續就方便不少了，具體配置免密能夠參考我以前寫的一篇文章。傳送門

安裝 node

服務器部署前端項目，node 是必須的，安裝的步驟也很簡單，直接參考菜鳥教程便可，相信你們按照步驟操做，確定是沒啥問題的，記得要選擇好你 linux 的系統，有的是 Ubuntu，有的是 CentOS。

上傳項目

咱們在登陸到服務器上以後，進入到本身想要存放項目的目錄，而後將本身的項目上傳到服務器上。前面我也提到了，咱們這篇文章暫時不使用 jenkins 自動部署，因此須要咱們本身將項目進行上傳，咱們可使用 git 把項目拉下來，也可使用 linux 命令將本地項目上傳到服務器上。

這裏推薦使用 git，方便快捷，就和你本地拉 git 項目是同樣的，若是想知道怎麼將本地文件上傳到服務器上，能夠看一下我以前寫的Linux 經常使用命令，使用 scp 的方式便可。

使用 git 拉取項目，你能夠先在你的機器上使用 git --version 查看是否有 git，而且版本是多少，若是有，多是 linux 自帶的，若是沒有，能夠根據 git 如何安裝去進行操做。

linux 自帶的 git 在拉取項目的時候，可能會出現如下錯誤：

The requested URL returned error: 401 Unauthorized while accessing
複製代碼

這個是由於 git 的版本過低了，咱們將 git 的版本進行升級便可，具體操做以下：

• 安裝依賴

yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel asciidoc
yum install  gcc perl-ExtUtils-MakeMaker
複製代碼

• 卸載老版本

yum remove git
複製代碼

• 下載新版並解壓安裝

wget https://github.com/git/git/archive/v2.2.1.tar.gz
tar zxvf v2.2.1.tar.gz
cd git-2.2.1
make configure
./configure --prefix=/usr/local/git --with-iconv=/usr/local/libiconv
make install
echo "export PATH=$PATH:/usr/local/git/bin" >> /etc/bashrc
source /etc/bashrc
複製代碼

• 再次查看 git 版本

git --version
複製代碼

輸出 git 版本說明安裝成功了。

git version 2.2.1

再次拉取代碼就能夠成功了。

使用 pm2

前面也說了，咱們暫且不討論使用 nginx，先使用 pm2 進行服務的管理。

列舉一下 pm2 的主要特性吧，方便你們瞭解：

• 0 秒停機重載，自動重啓
• 內建負載均衡
• 中止不穩定的進程
• 性能監控
• 錯誤日誌

咱們這裏主要使用 pm2 運行服務，其餘功能，你們能夠下去慢慢了解。

安裝 pm2

npm i -g pm2
複製代碼

安裝完成以後使用 pm2 -v 查看版本號，這個時候可能又會有問題，就是提示 pm2 的命令不存在，以下：

bash: pm2: command not found
複製代碼

若是你的服務器沒提示這個錯誤，恭喜你，避免了一個大坑，若是出現，也沒必要緊張，我教你怎麼解決。

這個是由於軟鏈接的問題，咱們安裝其餘的 npm 全局包也會出現一樣的問題，配置一下環境變量就能夠了。

# 用一個通用的命令配置環境變量
~$ echo -e "export PATH=$(npm prefix -g)/bin:$PATH" >> ~/.bashrc && source ~/.bashrc

# 上面的命令中使用 npm prefix -g 獲取node安裝目錄

# 再執行命令
~$ pm2 -v
3.5.1
複製代碼

這個時候就解決 node 軟鏈接的問題了，後續安裝其餘的 npm 包也不會有問題了。

pm2 經常使用命令

既然使用了 pm2，那咱們就要知道一些它經常使用的命令，好比跑服務，終止服務，查看日誌。

• 啓動服務

pm2 start app.js --watch
複製代碼

• 查看當前服務列表

pm2 list
複製代碼

• 重啓

pm2 restart app_name || pid
複製代碼

• 中止

pm2 stop app_name || pid
複製代碼

• 查看某個進程的信息

pm2 show app_name || pid
複製代碼

會出現你服務的詳細信息：

• 查看日誌

pm2 log app_name | pid
複製代碼

具體能夠跑一個服務起來，而後查看一下試試。

啓動服務

node 服務

服務器上目前已經有 node，npm，pm2 和咱們本身的項目了，這個時候進入到項目裏邊去，執行安裝依賴，啓動服務便可。

npm install

pm2 start app.js --watch
複製代碼

這只是一個簡單的例子，真正的項目，可能會存在啓動腳本以及項目中會有 pm2 的配置文件，這個要具體看你的項目，本文主要是幫助新手瞭解項目的部署，想要詳細瞭解能夠後續關注個人掘金及公衆號或者自行搜索解決。

前端靜態頁面

若是是前端靜態頁面，咱們想要在服務器上跑一個服務，不使用 nginx 的話，能夠用 pm2 配合 http-server 進行服務的啓動。

pm2 start http-server --name my-file-server -- -p 8080 -d false
複製代碼

若是提示你 http-server 不存在的話，可使用如下命令從新操做：

which http-server
# 會輸出http-server的目錄，如 /usr/bin/http-serve

# 接下來在使用http-server時，把目錄補上便可
pm2 start /usr/bin/http-server --name my-file-server -- -p 8080 -d false
複製代碼

這個時候你就能夠根據 服務器的ip:port/xx 去進行訪問了。

其餘問題

當你的服務啓動成功後，在瀏覽器可能會被限制訪問，這個時候你能夠在服務器上使用 curl xxx 去進行訪問，若是服務器訪問沒問題，那多是由於服務器對於端口號沒有開放，或者有防火牆，去搜索引擎一搜索都是解決辦法。

收穫

本文主要是實戰篇，幫助對項目部署不是很熟悉的小夥伴瞭解項目部署，若是你有本身的服務器或者以前操做過，那這些可能對於你來講是小 case，若是你沒進行過以上的操做，但願你能夠去騰訊或者阿里雲買個服務器，也能夠和本身公司運維申請一下測試環境本身部署，去實戰一下，畢竟學習了必定要實踐以後，才能發現問題在哪，才能記憶更深入。

但願本文對你有幫助，後續還會出一些比較深刻的實戰篇，你們能夠關注個人掘金和公衆號，有更新第一時間推送。

閱讀完後兩部曲

1. 很是感謝各位花時間閱讀完，麻煩各位動動手指，點個贊，分享一下，您的鼓勵是我前進的動力。
2. 順便但願各位關注一下個人公衆號，新的文章第一時間發到公衆號，公衆號主要發一些我的隨筆、讀書筆記、還有一些技術熱點和實時熱點，而且還有很是吸引人的我的自費抽獎活動哦~