前端自動化開發(fā)之Node.js的環(huán)境搭建教程

一、為什么我們前端自動化開發(fā)

十年專注成都網(wǎng)站制作,成都企業(yè)網(wǎng)站定制,個人網(wǎng)站制作服務(wù),為大家分享網(wǎng)站制作知識、方案,網(wǎng)站設(shè)計流程、步驟,成功服務(wù)上千家企業(yè)。為您提供網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)頁設(shè)計及定制高端網(wǎng)站建設(shè)服務(wù),專注于成都企業(yè)網(wǎng)站定制,高端網(wǎng)頁制作,對成都活動板房等多個領(lǐng)域,擁有多年建站經(jīng)驗。

相信任何學(xué)開發(fā)的,不管學(xué)什么語言,老師都這樣講過,作為一名開發(fā)人員,你最大的精力應(yīng)該是放在創(chuàng)造力上面,don't you repeat myself 不要重復(fù)自己,而在我們開發(fā)過程中,往往存在很多大量的重復(fù)操作,所以我們需要為這些操作省去時間,騰出更多的時間來讓我們創(chuàng)造。

而自動化開發(fā)能帶來哪些自動化:

     1.自動編譯(將less,sass等自動編譯)

     2.自動合并(將頁面引入的多個js文件,或者css文件,合并為同一個且壓縮)

     3.自動刷新(IDE保存,瀏覽器不用刷新,自動看到效果)

     4.自動部署(自動將項目打包部署到指定目錄)

     5.自動同步(能夠方便實現(xiàn)多個瀏覽器窗口,同步點擊,輸入,調(diào)試)

有沒有感覺很心動額,能夠幫我們做這么多事情,所以下面我們就來搭建吧,此次搭建,包括環(huán)境搭建,工具搭建,項目架構(gòu)搭建,連載,今天這篇,將環(huán)境搭建的初步,nodejs環(huán)境搭建。

二、Node.js是個什么東西?

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. 
Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient. 
Node.js' package ecosystem, npm, is the largest ecosystem of open source libraries in the world. 

翻譯一哈就是:Node.js是一個基于Chrome V8引擎的javascript的運行環(huán)境,其使用了事件驅(qū)動,非阻塞I/O模型,非常輕便高效,其包管理工具npm,是全球最大的開源庫生態(tài)系統(tǒng)。

意思就是,本來瀏覽器在顯示我們看到的網(wǎng)站的時候,會做很多事情,頁面渲染,js渲染等等,然后node把其中js渲染的引擎拿出來,并且使用了谷歌的V8,然后在其外面又封裝了一層api,讓其擁有了文件讀寫,網(wǎng)絡(luò)等操作,提供了一個服務(wù)端的運行環(huán)境,但卻是運行的javascipt。所以說nodejs給前端開發(fā)行業(yè)帶來了一場工業(yè)革命。

三、安裝Node.js

安裝有多種方式,,https://nodejs.org/en/ 可以直接在官網(wǎng),下載安裝版安裝,這種方式很簡單粗暴,下一步就解決,就不多介紹了,介紹另一種方式,nvm安裝,因為有時我們在使用過程中,可能要用多種版本的node,而nvm可以讓我們在使用過程方便的切換的使用版本。

第一步下面NVM的包,https://github.com/coreybutler/nvm-windows/releases ,我們選擇第一個:nvm-noinstall.zip 下載完成后解壓到一個地方,比如: C:\dev\nvm 里面的文件列表是這樣的:elevate.cmd、elevate.vbs、install.cmd、LICENSE、nvm.exe

雙擊 install.cmd 然后會讓你輸入”壓縮文件解壓或拷貝到的一個絕對路徑” 先不用管它,直接回車,成功后,會在C盤的根目錄生成一個settings.txt的文本文件,把這個文件剪切到C:\dev\nvm目錄中,然后我們把它的內(nèi)容修改成這樣:

root: C:\dev\nvm 
path: C:\dev\nodejs 
arch: 64 
proxy: none 

然后我們開始配置環(huán)境變量了,因為剛剛點擊了install.cmd的文件,那么會在環(huán)境變量的系統(tǒng)變量中,生成兩個環(huán)境變量:NVM_HOME 和NVM_SYMLINK 我們開始修改這兩個變量名的變量值:NVM_HOME的變量值為:C:\dev\nvm; NVM_SYMLINK的變量值為:C:\dev\nodejs

然后我們配置PATH的環(huán)境變量,為了添加%NVM_SYMLINK%,%NVM_HOME%,

打開cmd,輸入命令nvm -v看到版本信息,就說明安裝成功了

然后下載nodejs,輸入命令,nvm install lastest就可以下載最新版本的node,如果要指定版本,也可以nvm install 6.4.0,如果電腦是32位的,注意在后面加上32,nvm install 6.4.0 32,因為默認是64位的

四、npm的安裝

我們安裝的每個node版本中已經(jīng)自帶了一個npm,但是由于我們可能會有切換node版本的時候,這時為了統(tǒng)一起見,我們需要安裝一個全局的npm

首先我們進入命令模式,輸入 npm config set prefix "C:\dev\nvm\npm" 回車,這是在配置npm的全局安裝路徑,然后在用戶文件夾下會生成一個.npmrc的文件,用記事本打開后可以看到如下內(nèi)容:prefix=C:\dev\nvm\npm

然后繼續(xù)在命令中輸入: npm install npm -g 回車后會發(fā)現(xiàn)正在下載npm包,在C:\dev\nvm\npm目錄中可以看到下載中的文件,以后我們只要用npm安裝包的時候加上 -g 就可以把包安裝在我們剛剛配置的全局路徑下了。

我們?yōu)檫@個npm配置環(huán)境變量: 變量名為:NPM_HOME,變量值為 :C:\dev\nvm\npm

在Path的最前面添加; %NPM_HOME%,注意了,這個一定要添加在 %NVM_SYMLINK%之前,所以我們直接把它放到Path的最前面

最后我們新打開一個命令窗口,輸入npm -v ,此時我們使用的就是我們統(tǒng)一下載的npm包了。

同樣的我們還可以安裝cnpm工具,它是中國版的npm鏡像庫,地址在這里:https://cnpmjs.org/,也是npm官方的一個拷貝,因為我們和外界有一堵墻隔著,所以用這個國內(nèi)的比較快,淘寶也弄了一個和npm一樣的鏡像庫,http://npm.taobao.org/,它和官方的npm每隔10分鐘同步一次。安裝方式:

npm install -g cnpm --registry=http://r.cnpmjs.org

或者用淘寶的npm install -g cnpm --registry=https://registry.npm.taoba.org

安裝好了cnpm后,直接執(zhí)行cnpm install 包名比如:cnpm install bower -g 就可以了。-g只是為了把包安裝在全局路徑下。如果不全局安裝,也可以在當(dāng)前目錄中安裝,不用-g就可以了。

五、nrm安裝

什么是nrm?

nrm就是npm registry manager 也就是npm的鏡像源管理工具,有時候國外資源太慢,那么我們可以用這個來切換鏡像源。
我們只要通過這個命令: npm install -g nrm 就可以實現(xiàn)安裝。

注意: -g可以直接放到install的后面,我們以后也最好這樣用,因為這樣用,我們可以在cmd中上下箭頭切換最近命令的時候,容易修改,更方便操作。安裝完成后,我們就可以使用了。

命令:nrm ls 用于展示所有可切換的鏡像地址

命令:nrm use cnpm 我們這樣就可以直接切換到cnpm上了。當(dāng)然也可以按照上面羅列的其他內(nèi)容進行切換。

總結(jié)

以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對創(chuàng)新互聯(lián)的支持。

當(dāng)前標(biāo)題:前端自動化開發(fā)之Node.js的環(huán)境搭建教程
網(wǎng)址分享:http://muchs.cn/article46/ihdjhg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站導(dǎo)航、網(wǎng)站改版、外貿(mào)建站App設(shè)計、網(wǎng)站建設(shè)面包屑導(dǎo)航

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站建設(shè)網(wǎng)站維護公司