筆者最近在學習<code>vue.js</code>,不過一直都是在runoob上面各種嘗試。今天筆者在本機(Ubuntu16.04)嘗試部署了nodejs+npm+vue開發環境,接下來将盡可能詳細的講述安裝過程,幫助新人少走一些彎路。
說到nodejs的安裝,筆者在安裝之前查閱了一些資料,大概有這麼幾種路子:
官網下載下傳源碼或二進制壓縮包進行編譯安裝
<code>apt-get</code> / <code>yum</code> 安裝
<code>nvm</code>nodejs版本管理器安裝
筆者對這三個都進行了逐一嘗試,結果如下:
對于源碼編譯安裝,貌似網上有相當一部分人是這麼做的。不過筆者在本機親測的結果是,安裝會出現迷之<code>Protocol error</code>,而且根據錯誤資訊查閱了stackoverflow後仍然毫無線索。
<code>apt-get</code>安裝,看似容易
但是這麼一安裝後,在後續安裝npm的時候,出現版本不比對的問題,被npm要求強制更新,然而apt-get的更新日常神坑,于是棄坑。
<code>nvm</code>安裝。說到<code>nvm</code>是啥,和<code>ruby</code>對應的<code>rvm</code>類似,全稱為Nodejs Version Manager,簡寫就是<code>nvm</code>。這是一個nodejs版本管理器,本文将介紹這一種安裝方式。
實際安裝過程也并不複雜。
首先使用<code>curl</code>
或使用<code>wget</code>
然後運作
将系統指令進行同步。然後來檢測下是否安裝妥當
如果正确顯示了版本号,則說明<code>nvm</code>安裝完畢
那我們接下來先看一看<code>nvm</code>都有什麼樣的功能
顯示的幫助資訊如下:
可以看到,比較主要的幾個:
<code>nvm ls</code> 展示已安裝的<code>nodejs</code>版本清單(實際上還包括使用情況)
<code>nvm install</code> 安裝新的<code>nodejs</code>版本
<code>nvm use</code> 将目前系統的<code>nodejs</code>版本切換到指定的版本
<code>nvm alias default</code> 将某個版本設定為預設使用版本
接下來我們來安裝最新的穩定版本
我們可以使用<code>stable</code>關鍵字,表示最新的穩定版本。
接下來啟用這一版本(筆者寫這篇文章的時候,最新穩定版本為<code>v9.11.1</code>,該版本号因時而異。在進行這一步之前可以先使用<code>nvm ls</code>檢視目前已經安裝了哪些版本)
然後測試下是否配置正确
如果顯示了正确的版本号,則表示一切正常。
為了友善下次開機後的快速使用,我們可以将這一版本設定為預設版本
這樣一來,基本的配置就妥當了。
正常情況下,當<code>nvm</code>正确安裝後,與之比對的<code>npm</code>也将安裝完畢,可以使用如下指令檢測下
類似于<code>nvm</code>,正常顯示版本号則表示安裝正常。
如果遇到問題,則可以嘗試Stack Overflow等途徑解決。(注:筆者在運作完之前的配置過程後,npm已經自動安裝為了與nodejs版本比對的版本,正常情況下這應該是一個自動的過程。由于筆者沒有遇到這樣的問題,是以如果有讀者遇到了這樣的問題可以嘗試解決并可以的話希望進行留言)
以上都配置妥當隻有,我們就可以開始<code>vue</code>的安裝過程了。(注:在這一部分,筆者參照的是runoob的配置教材)
我們可以首先安裝<code>cnpm</code>
在使用npm的時候注意以下幾點:
盡量不要使用<code>sudo</code>,除非出現檔案權限不夠的時候(實際上權限不夠也應該盡量通過修改系統權限等方式解決)
安裝全局包的時候,一定要記得使用<code>-g</code>指令,表示全局安裝。如果不加的話意思是給目前路徑位置上的app安裝此包。
安裝完畢後,我們可以直接進行安裝
安裝完畢後我們可以檢查下<code>vue</code>版本
如果出現了正常的版本号,則說明配置正常。
以上就是在Ubuntu16系統内從零開始配置nodejs+npm+vue環境的方法,希望能給大家帶來些幫助。