溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

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

發布時間:2021-06-21 14:31:48 來源:億速云 閱讀:138 作者:小新 欄目:web開發

這篇文章主要介紹了如何使用vue-cli+webpack搭建vue開發環境,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

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

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

git用的是linux命令

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

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

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

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

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

然后我們執行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+webpack搭建vue開發環境

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

我們執行npm install

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

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

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

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

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

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

感謝你能夠認真閱讀完這篇文章,希望小編分享的“如何使用vue-cli+webpack搭建vue開發環境”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,更多相關知識等著你來學習!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女