【VUE】VUE環境+項目搭建詳解

一、環境搭建:

1、安裝nodejs:

 步驟:在node官網(https://nodejs.org/en/download/ )選擇跟自己的電腦匹配的版本進行下載,然後一步步的安裝即可,在cmd控制檯輸入 node -v ,如果出現版本信息即表示安裝成功。

2、查看npm包管理器,爲了提高效率,安裝淘寶鏡像安裝相關依賴。

1> npm包管理器是集成在node中的,所以直接輸入 npm -v 就能查看到版本信息,若出現版本信息則表示npm能正常使用。

2> 輸入 npm install -g cnpm --registry=http://registry.npm.taobao.org  ,安裝淘寶鏡像安裝相關依賴。以後再用到npm的地方直接用cnpm來代替就好了

3>檢查是否安裝成功:cnpm -v

3、安裝Vue腳手架vue-cli

1> 執行命令安裝:cnpm install vue-cli -g //全局安裝 vue-cli

2、檢查腳手架安裝情況:

vue list

 

 

二、項目搭建

1、進入你的項目目錄,創建一個基於 webpack 模板的新項目:

 vue init webpack vue-demo

說明:
Vue build ==> 打包方式,回車即可;

Install vue-router ==> 是否要安裝 vue-router,項目中肯定要使用到 所以Y 回車;

Use ESLint to lint your code ==> 是否需要 js 語法檢測 目前我們不需要 所以 n 回車;

Set up unit tests ==> 是否安裝 單元測試工具 目前我們不需要 所以 n 回車;

Setup e2e tests with Nightwatch ==> 是否需要 端到端測試工具 目前我們不需要 所以 n 回車;
至此模板項目創建成功

2、項目運行:

在控制檯,進入項目目錄,然後再瀏覽器輸入:http://localhost:8080/,出現“Welcome to Your Vue.js App”,啓動成功。
cd vue-demo  

npm run dev

 

 

 

 

 

 

 

發佈了34 篇原創文章 · 獲贊 19 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章