利用Vue-cli搭建Vue項目框架的教程詳解
首先安裝node.js
1.在新建的目錄中按住shift 鼠標(biāo)右鍵，在此處打開命令窗口，版本保證在4.x以上
node -v
2.全局安裝vue腳手架
npm install -g vue-cli
同時可以使用vue和vue list 命令查看
3.初始化模板配置和項目名字
vue init webpack mycharts
mycharts是項目名
其中有許多需要選擇的選項，eslint適合團(tuán)隊開發(fā)，規(guī)范代碼之類的，個人開發(fā)我喜歡用stylus，所以這個選項我不會選n，其他Y
4.有提示就按enter，需要輸入就輸入具體參考這下面這張圖
5.進(jìn)入sell項目目錄中
shift + 鼠標(biāo)右鍵，進(jìn)入命令窗口，下載依賴包
npm install
6.啟動項目
npm run dev
ico圖標(biāo)制作 https://icomoon.io/app/#/select/font
剩下的就按需加載，安裝過程中，有時候，第一次安裝會報錯，重復(fù)安裝一次就好
安裝 babel-polyfill es6-promise
npm install babel-polyfill es6-promise --save-dev
安裝stylus stylus-loader
npm install stylus-loader stylus --save-dev
安裝vue-style-loader
npm install vue-style-loader --save-dev
安裝css-loader
npm install css-loader --save-dev
安裝vuex，全局變量的使用
npm install vuex --save-dev
安裝axios，前后臺通信框架
npm install axios --save-dev
安裝iviewui，第三方框架
npm install iview --save-dev
安裝echarts
npm install echarts --save-dev
安裝jquery
npm install jquery --save-dev
import $ from 'jquery'
從github上down項目vue項目下來的時候，在控制臺執(zhí)行
npm install
之后再運(yùn)行項目即可
剩下的跟平時開發(fā)是一樣的了
到此這篇關(guān)于利用Vue-cli搭建Vue項目框架的教程詳解的文章就介紹到這了,更多相關(guān)Vue-cli搭建Vue項目框架內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vuejs中監(jiān)聽窗口關(guān)閉和窗口刷新事件的方法
今天小編就為大家分享一篇vuejs中監(jiān)聽窗口關(guān)閉和窗口刷新事件的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
vue再次進(jìn)入頁面不會再次調(diào)用接口請求問題
這篇文章主要介紹了vue再次進(jìn)入頁面不會再次調(diào)用接口請求問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
解決vue this.$forceUpdate() 處理頁面刷新問題（v-for循環(huán)值刷新等）
這篇文章主要介紹了解決vue this.$forceUpdate() 處理頁面刷新問題（v-for循環(huán)值刷新等），解決方法是使用this.$forceUpdate()強(qiáng)制刷新，文章給大家分享了代碼案例，需要的朋友參考下吧2018-07-07
今天小編就為大家分享一篇修改vue+webpack run build的路徑方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
Electron-vue開發(fā)的客戶端支付收款工具的實(shí)現(xiàn)
這篇文章主要介紹了Electron-vue開發(fā)的客戶端支付收款工具的實(shí)現(xiàn)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-05-05
這篇文章主要為大家詳細(xì)介紹了Vue.JS入門教程之事件監(jiān)聽,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
基于Vue+ELement搭建動態(tài)樹與數(shù)據(jù)表格實(shí)現(xiàn)分頁模糊查詢實(shí)戰(zhàn)全過程
這篇文章主要給大家介紹了關(guān)于如何基于Vue+ELement搭建動態(tài)樹與數(shù)據(jù)表格實(shí)現(xiàn)分頁模糊查詢的相關(guān)資料,Vue Element UI提供了el-pagination組件來實(shí)現(xiàn)表格數(shù)據(jù)的分頁功能,需要的朋友可以參考下2023-10-10
這篇文章主要介紹了Vue關(guān)于自定義事件的$event傳參問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
Vue實(shí)現(xiàn)動態(tài)路由的示例詳解
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)動態(tài)路由的相關(guān)知識,主要涉及到兩個方面：一是路由的動態(tài)添加,二是基于路由的參數(shù)變化來動態(tài)渲染組件,下面就跟隨小編一起深入學(xué)習(xí)一下動態(tài)路由的實(shí)現(xiàn)吧2024-02-02
淺析vue-router實(shí)現(xiàn)原理及兩種模式
這篇文章主要介紹了vue-router實(shí)現(xiàn)原理及兩種模式分析,給大家介紹了vue-router hash模式與history模式不同模式下處理邏輯，需要的朋友可以參考下2020-02-02