閒聊一下子 >_< 這篇文章只是剛剛打開vue的大門,放輕鬆~~
先檢測下node版本吧!或許你尚未安裝node呢~
(若是使用Mac在安裝的時候報錯,除了網絡緣由就是權限問題,你要在安裝的指令前加上sudo)vue
在終端輸入指令node
$ node -v
若是你看不到版本號的話,那就勞煩去官網安裝一個吧。
固然,若是你安裝了node,天然就會有npm工具了。
官網地址:https://nodejs.org/en/download/webpack
接下來,咱們就能夠先全局安裝vue-cli~web
在終端輸入指令vue-router
$ npm install -g vue-cli
=======......若是等的實在是太漫長了,那就Ctrl+c結束這段漫長的等待,使用國內的淘寶鏡像cnpm
在終端輸入指令vue-cli
npm install -g cnpm –registry=[https://registry.npm.taobao.org]
安裝完成後能夠輸入cnpm -v去檢測,若是返回版本號,說明安裝成功。只要把npm換成cnpm的寫法就能夠愉快的使用淘寶鏡像去安裝你須要的東西了。npm
最後,檢測一下咱們是否安裝成功了vue-clijson
在終端輸入指令瀏覽器
$ vue - V
注意是大寫的V,大寫的~
看到版本號了,說明安裝成功了。網絡
首先,cd到本身想要建立新項目的文件夾下
< vue init 模板類型 項目名稱 > 以這樣的格式
其中,模板類型有:
(根據項目需求來選擇模板類型,我這裏就選擇最全面的webpack模板吧!)
在終端輸入指令
$ vue init webpack item
item是我本身取的項目名稱
而後,就會讓你填寫一些項目的信息(不知道選什麼就一路回車就對了,哈哈~對了,填寫項目名稱要小寫字母哦!)
個人正在初始化,但是好慢,也許是網速的緣由吧~
報錯了!!應該是忘了給權限~
再次在終端輸入指令
$ sudo vue init webpack item
噢耶!終於初始化成功了!
接着,cd進入到建立的目錄
按照我標註的紅色框框去一步步作~
第一,進入到建立的目錄
第二,輸入指令 npm install ,由於自動構建過程當中已存在package.json文件,因此這裏直接安裝依賴就行。(安裝 vue 路由模塊 vue-router 和網絡請求模塊 vue-resource,輸入:cnpm install vue-router vue-resource --save)。
第三,啓動項目,輸入指令 npm run dev
第四,複製http://localhost:8080這個連接,瀏覽器會默認打開一個「歡迎頁面」。