保證已經安裝好了node\npm\vue等工具,將路徑設置爲想要創建新項目的文件夾路徑vue
二、關於npm與cnpm
npm包管理器,是集成在node中的,node環境安裝完成,npm包管理器也有了。因爲有些npm有些資源被屏蔽或者是國外資源的緣由,常常會致使後面用npm安裝依賴包的時候失敗,全部我還須要npm的國內鏡像---cnpm。node
安裝cnpm:webpack
在命令行中輸入web
npm install -g cnpm --registry=http://registry.npm.taobao.orgvue-cli
而後等待,完成以後,咱們就能夠用cnpm代替npm來安裝依賴包了npm
三、安裝vue-cli腳手架構建工具瀏覽器
在命令行中運行命令架構
cnpm install -g vue-cli 框架
而後等待安裝完成。(注意,這裏使用cnpm來替代npm,否則速度超級慢,會致使卡在那)工具
經過以上三步,咱們須要準備的環境和工具都準備好了,接下來就開始使用vue-cli來構建項目
四、構建結構框架
腳手架裝完後,在命令行中運行命令
vue init webpack firstVue
這個命令的意思是初始化一個項目,其中webpack是構建工具,也就是整個項目是基於webpack的。其中firstlsqVue是整個項目文件夾的名稱,自定義,這個文件夾會自動生成在你指定的目錄中.
運行初始化命令的時候回讓用戶輸入幾個基本的選項,如項目名稱,描述,做者等信息,若是不想填直接回車默認就好,隨後,文件夾中就會出現不少基本的目錄結構和代碼。其中,咱們主要在src目錄中作修改。到這裏,這個項目如今還只是一個結構框架,整個項目須要的依賴資源(就是前面說到的npm安裝依賴包)都尚未安裝。
五、安裝項目所需的npm依賴包(使用前面的cnpm)
要安裝依賴包,首先cd到項目文件夾(firstlsqVue文件夾)
cd firstlsqVue
而後運行命令
cnpm install
安裝完成後,原來的目錄結構中會出現一個新的文件夾:node_modules,裏面就是咱們項目須要的依賴包資源,安裝完依賴包以後,就能夠運行整個項目了
在項目目錄中,運行的命令如上面一種所示,
npm run dev
會用熱加載的方式運行咱們的應用,熱加載可讓咱們在修改完代碼後不用手動刷新瀏覽器就能實時看到修改後的效果。