vue環境搭建詳細步驟

2022-08-21 09:54:15 字數 1891 閱讀 1295

win+r  ,輸入cmd,開啟dos命令板:輸入命令 「npm install --global vue-cli」,會出現以下情況:

我們可以用命令列「npm -v」或「node -v」檢視安裝的版本號,以此來檢測是否安裝成功:

三、cnpm的安裝

四、vue-cli的安裝(cnpm下再全域性安裝vue-cli)

vue-cli是vue官方提供的乙個命令列工具,可用於快速搭建大型單頁應用。該工具提供開箱即用的構建工具配置,帶來現代化的前端開發流程。只需一分鐘即可啟動帶熱過載、儲存時靜態檢查以及可用於生產環境的構建配置的專案。

安裝命令為:cnpm install -g vue-cli,回車,等待安裝。

安裝完後,檢查是否安裝成功,輸入vue,出現以下提示表示安裝成功。

五、試試新建乙個vue專案

(1)新建乙個專案資料夾,命名為 vue-demo,cd到此資料夾,輸入:vue init webpack vue-demo,回車,按照如下操作進行初始化:

我們暫時不適用模板提供的測試框架,karma + mocha,以及nightwatch。

(2)專案目錄

(3)安裝專案依賴的包(進入到乙個檔案中的cmd指令是cd vue-demo)

cd到vue-demo 資料夾,執行cnmp install,安裝依賴包,安裝完成之後,專案目錄下多了node_modules:

(4)執行專案

在命令列裡輸入 cnpm run dev,執行完成後啟動專案,瀏覽器出現以下接結果,說明啟動成功。注意瀏覽器的版本,低版本的不支援哦。

cmd使用

1,「開始」——「執行」,輸入cmd,回車。

2,出現「命令提示符」的視窗,一般情況下是 c:\documents and settings\administrator> ,輸入 f: 回車,就變成 f:\> 了。

3,輸入 dir 就可以看到f盤下面的檔案了。

4,cd (後面跟你的**資料夾的名字)。例如:f:\>cd tddownload 就可以進入到f盤下的tddownload資料夾。

5、輸入 cd\ 回車 返回主目錄

6、輸入 cd.. 回車 返回上一級目錄

vue環境搭建步驟

vue.js是前端乙個比較火的mvvm框架,要使用它,我們必須提前配置,其中有一種安裝方式是使用npm,比較適合比較大型的應用。今天就來看看這種方式如何操作,由於npm是國外的,使用起來比較慢,我們這裡使用 的cnpm映象來安裝vue.1.開啟命令列視窗,輸入 獲取到cnpm以後,我們需要公升級一下...

vue環境搭建步驟

安裝2 檢視node是否安裝成功 windows r cmd 開啟命令列 輸入 node v 檢視node版本,node版本需要 8.9 使用的時候 寫cnpm,等同於npm 4 安裝vue cnpm install vue g5 安裝腳手架 cli 如果之前已經安裝過舊版本 非3.x 腳手架,需要...

搭建vue專案環境步驟

npm install global vue cli 1 儀錶盤外掛程式中新增外掛程式,搜尋 vue cli plugin element安裝 2 安裝完成,在配置外掛程式中,第一項選擇import on demand 按需手動配置 1 儀錶盤依賴中安裝依賴,執行依賴中搜尋axios,進行安裝 2 ...