1. 程式人生 > >nodejs解壓版安裝和配置(帶有搭建前端專案腳手架)

nodejs解壓版安裝和配置(帶有搭建前端專案腳手架)

nodejs 安裝  我先前用了nvm,覺得nvm挺厲害可以隨時更換nodejs版本,但是研究了下,可能自己功力不夠還是什麼,並不好用,中間還出現了錯誤;所以最後還是解除安裝了;

本文圖文並茂的一步一步的來,旨在好用簡潔:

1】第一步:下載nodejs

中文官網:

https://nodejs.org/zh-cn/download/

如下圖是最新的版本,不用怕這是最新的直接下載就可以了,選擇windows版本,LTS是長期支援版本,箭頭所示下載64位壓縮版;個人覺得壓縮版本就夠了;(可能安裝版的功能更多,為了方便這裡使用解壓版就夠做專案了)

2】第二步:解壓上面下載的壓縮包,然後在安裝目錄下新建兩個資料夾 node-cache 和 node-global

                    這裡要注意一定要在解壓縮包當前目錄裡開啟cmd視窗:shift+滑鼠右鍵----->開啟命令視窗,否則是沒有npm命令的;

                    cmd執行,配置NPM全域性模組路徑和cache預設安裝位置

                    npm config set cache "E:\nodeInstall\node-v10.14.0-win-x64\node-cache"
                    npm config set prefix "E:\nodeInstall\node-v10.14.0-win-x64\node-global"

3】第三步:修改配置環境變數     

                  在桌面右鍵我的電腦(或計算機)---屬性 ---高階系統設定----環境變數----       

                  新增NODE_HOME : E:\nodeInstall\node-v10.14.0-win-x64    (你的nodejs安裝根目錄,如下圖)
                  path新增:    ;%NODE_HOME%;%NODE_HOME%\node-globa;  

                 

以上就配置好了環境變數;

4】第四步:修改npm映象為taobao   為什麼要這麼做,因為如果用npm下載更新的話,npm速度回非常慢,而且容易出錯;

                    npm install -g cnpm --registry=https://registry.npm.taobao.org    注意執行這個命令,黑視窗還是在你的nodejs 安裝根目錄,就是你上邊一致執行的視窗;

                    執行完畢,關閉黑視窗命令;

5】第五步:重新開啟cmd命令視窗(cnpm 命令無效說明上一步沒做好,因為上一步已經配置了全域性),安裝vue-cli 腳手架:                  

                    cnpm install --global vue-cli
                    簡寫: cnpm i -global vue-cli

     到這一步nodejs已經安裝完了 ,並帶有vue-cli;

6】第六步: 隨便在你的電腦選一位置(建立專案資料夾),cmd執行

                    vue init webpack   xxx_front         其中“xxx_front”為你的前端專案名稱,等待完成後,到此你的前端框架已經搭建完成;

 

7】執行專案:執行前先在你的專案根目錄下:cnpm install 或cnpm i 安裝前端需要的包,安裝好回多出一個資料夾:node_modules   

                       然後還是在你的專案跟目錄,黑視窗執行cnpm run dev 

                      後續打包的命令是cnpm run build

本文章到此結束覺得好,給個贊,由於一個清晰的好的文件編輯是辛苦,儘量尊重我的原版;