使用vue-cli+webpack搭建vue開發環境


 

在這里我真的很開心,好久沒有用過博客,今天突然看到了我的博客有不少人看過,雖然沒有留下腳印,但是還是激起了我重新拿起博客的信心,感謝大家。

在這里我們需要首先下載node,因為我們要用到npm包下載,是基於node的

廢話不多說,我們直接進入正題

下載node,同時需要下載git,以后我們就在git上輸入命令來搭建我們的vue環境

git用的是linux命令

不要問為什么,能用就行,你說是不是?

windows系統,下載完git以后我們再桌面右擊鼠標會看到git Bash,點開它,然后就打開了git,

git有很多功能,同時git可以往github上push你的文件,github是一個很不錯的倉庫管理工具哦

好,我們直接開始,打開git之后會顯示

然后我們執行npm install webpack

就會自動下載webpack最新版本了

在這里我們直接進入正題,怎么使用vue-cli搭建vue的開發環境

在這里我們需要全局安裝vue-cli

在git里執行npm install vue-cli -g  安裝vue命令環境

執行vue --verson查看是否安裝成功,

顯示vue的版本,就是安裝成功了

這樣就是全局安裝了

現在我們再命令行輸入vue init webpack-simple<模板名,就是你的項目的名稱>,

在這里我們用webpack-simple搭建,因為他沒有嚴格的規范,相對於大多數程序員來說比較好,他與webpack的區別在這里我就不細說了,如果需要的話大家可以在下面留言,我們給大家分享

在這里我的項目名稱為myvue

所以我執行vue init webpack-simple myvue

桌面會有一個myvue的文件夾

我們執行cd myvue進入到我們的項目下

會發現文件夾下會有這些文件,這就是vue-cli自動為我們搭建的環境了

我們執行npm install

這時候我們需要等待一小會,npm在為我們下載基於node的一些文件,

然后你會發現多了一個node——modules文件,里面是node的一些模塊

然后我們再命令行執行npm run dev

vue自動打開了瀏覽器,運行了此vue項目

這樣,我們使用vue-cli搭建vue的開發環境就算成功了,大家有沒有學會呢?

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM