最近在學習react.js的相關內容，為了怕以後忘記，就簡單地寫一下做個筆記。

準備

react.j的專案（webStorm）；
騰訊雲伺服器；
FileZilla（檔案傳輸）；

1、專案打包

在webStorm當中的控制檯輸入如下的命令

npm build run 

打包專案，此時會在目錄結構下面生成一個build的目錄

2、把打包的build檔案上傳至伺服器

此處我上傳的位置是騰訊雲下的/root/react目錄（這個目錄隨便指定）

可以看到打包的檔案已經成功上傳

3、在伺服器上安裝node.js 和npm工具

因為我們的專案是需要使用到node.js和npm，因此我們要在騰訊雲的伺服器上面安裝它們（放心，還是這裡還是比較簡單的，百度一下就能找到）

這裡給出一個傳送門，大家按照裡面的安裝就可以了（有問題可以私信或留言，我每天早上都會來瞄一眼的）

……好吧，我本來我是偷懶直接給傳送門的，我後臺發現一些細節上還是有區別的，所以還是自己老老實實寫一下吧

3.1部署Node.js

（1）下載node.js

下載的時候注意一下自己Linux的版本情況

(2)把下載的包通過FileZilla上傳到伺服器的/root/目錄下

然後把下載下來的壓縮包解壓，然後通過軟連線變為全域性

① tar -xvf   node-v6.10.0-linux-x64.tar.xz   

② mv node-v6.10.0-linux-x64  nodejs 

③確認一下nodejs下bin目錄是否有node 和npm檔案，如果有執行軟連線，如果沒有重新下載執行上邊步驟；
 

版本名稱根據自己的下載的包來更改

（3）建立軟連線，變為全域性變數

  ①ln -s /root/nodejs/bin/npm /usr/local/bin/ 
  ②ln -s /root/nodejs/bin/node /usr/local/bin/

（4）檢測node.js是否變為全域性

在Linux命令列node -v 命令會顯示nodejs版本，如圖所示為大功告成

3.2部署npm

4、安裝 npm server

關於server是npm的一個元件，它能夠直接通過一行命令就使你的專案釋出在網路，而且提供了簡潔的介面去監聽整個目錄的變化。

npm install -g serve
 

可以看到下面顯示了一句 [email protected]就說明我們的serve已經安裝好了

接下來我們來到這個目錄

在這個目錄下我們輸入如下命令啟動我們的專案

serve -s build 

結果卻得到了:

奇怪明明我們已經下載serve的包，但是執行命令卻找不到它，這是為什麼呢？

其實有點Linux知識的下夥伴很快就能發現，這是因為我們沒有把serve的命令加入到Linux的環境變數當中，不信的話你可以試試看下面這條命令：

/root/nodejs/lib/node_modules/serve/bin/serve.js build

從這裡就可以發現server這個命令實際上是依賴於/root/nodejs/lib/node_modules/serve/bin/serve.js這個js檔案

那麼難倒我們每次執行專案都要打這麼長一大串的東西嗎？！

當然不是，我們只需要將這個serve.js檔案所在的路徑設定為環境變數即可

然後我們就可以直接通過如下命令啟動：

serve.js build

然後通過通過騰訊雲的公網地址——http://公網ip:5000 去訪問我們的專案
【參考】
linux系統伺服器下如何部署並執行react應用？

到此，專案就成功部署了。

如果還有什麼問題歡迎留言交流~