推薦使用官方提供的命令行工具,可用於快速搭建大型單頁應用。只需一分鍾即可啟動帶熱重載、保存時靜態檢查以及可用於生產環境的構建配置項目。
1、安裝node https://nodejs.org/en/
由於有些npm有些資源被屏蔽或者是國外資源的原因,經常會導致用npm安裝依賴包的時候失敗,所有我還需要npm的國內鏡像---cnpm。
在命令行中輸入:npm install -g cnpm --registry=https://registry.npm.taobao.org回車,大約需要2分鍾,如果報錯或沒反應,則卸掉node.js重新安裝
2、安裝Git https://git-scm.com/download/win
3、安裝全局vue-cli腳手架,用於幫助搭建所需的模板框架。
輸入命令:cnpm install -g vue-cli回車等待完成 -g是全局安裝的意思
4、創建項目
首先我們要選定目錄,然后在命令行中把目錄轉到選定的目錄,
假如我們打算把項目新建在e盤下的vue文件夾中則輸入下面的命令:e:回車,然后cd vue,
然后輸入命令:vue init webpack 項目文件夾名稱,回車,
運行初始化命令的時候會讓用戶輸入幾個基本的選項,如項目名稱,描述,作者等信息,如果不想填直接回車默認就好。(一頓回車+N鍵就完成了)
如果出現下面問題說明nodejs版本過低,ES6的語法還不能支持,所以需要重新安裝高版本nodejs
5、安裝項目所需的依賴包
首先輸入:cd 項目名回車,然后輸入:cnpm install回車等待安裝,
安裝完成之后,會在我們的項目目錄firstVue文件夾中多出一個node_modules文件夾,這里邊就是我們項目需要的依賴包資源。安裝完依賴包之后,就可以運行整個項目了。
6、測試環境是否搭建成功
在cmd里輸入:cnpm run dev回車,項目運行成功后,瀏覽器會自動打開localhost:8080(如果瀏覽器沒有自動打開,可以手動輸入)。運行成功后,會看到Welcome to Your Vue.js App頁面。