1.查看node版本號(hào)
查看node.js版本號(hào)命令:node -v(6.9以上)
2.查看npm版本號(hào)
查看npm版本號(hào)命令:npm -v(3.10以上)
3.安裝全局cli
官網(wǎng)的命令行工具可以找到
直接復(fù)制粘貼回車即可(因我已經(jīng)安裝冒晰,就暫時(shí)不回車,嘻嘻)
4.檢測(cè)vue-cli是否安裝成功
檢測(cè)命令:vue --version
5.指定創(chuàng)建位置
還是使用命令骤肛,跟著路徑找尋
6.創(chuàng)建項(xiàng)目
回車后會(huì)花一點(diǎn)時(shí)間將項(xiàng)目模板下載下來(lái)
7.配置項(xiàng)目
配置項(xiàng)目臼节,回車
8.安裝依賴(走你)
直接cd創(chuàng)建的項(xiàng)目名稱
9.安裝依賴文件
命令:npm install
10.運(yùn)行
命令:npm run dev
直接給了一個(gè)localhost:8080的端口號(hào)
11.總結(jié):
1.使用腳手架能使開發(fā)速度更快妖碉;
2.腳手架是通過(guò)webpack搭建的開發(fā)環(huán)境室梅;
3.實(shí)現(xiàn)了頁(yè)面自動(dòng)刷新(編譯器里面一保存浙芙,瀏覽器就自動(dòng)刷新)蹂风;
4.可以使用ES6的語(yǔ)法(會(huì)在打包文件的時(shí)候變成ES5,不必但是瀏覽器對(duì)ES6不兼容沟沙,能夠正常去識(shí)別)河劝;
5.因?yàn)樯婕暗絯ebpack,能夠?qū)⒛惝?dāng)前所涉及到的所有JS文件矛紫,打包赎瞎,然后壓縮成一個(gè)文件,然后只需要引入一個(gè)文件就能夠正常使用所需要的庫(kù)颊咬;
6.所寫的項(xiàng)目是在腳手架環(huán)境中去編譯的务甥,而不是在瀏覽器中編譯。所有速度會(huì)很快喳篇;