詳解VSCode配置啟動Vue項(xiàng)目
下載安裝并配置VSCode
隨便百度上搜個(gè)最新的VSCode安裝好后,點(diǎn)擊Ctrl + Shit + X打開插件擴(kuò)展窗口進(jìn)行插件擴(kuò)展,這里要安裝兩個(gè)插件。
1、vetur插件的安裝
該插件是vue文件基本語法的高亮插件,在插件窗口中輸入vetur點(diǎn)擊安裝插件就行,裝好后點(diǎn)擊文件->首選項(xiàng)->設(shè)置 打開設(shè)置界面,在設(shè)置界面右側(cè)添加配置
"emmet.syntaxProfiles": { "vue-html": "html", "vue": "html" }
2、eslint插件的安裝
eslint智能錯(cuò)誤檢測插件,在具體開發(fā)中作用很大,能夠及時(shí)的幫我們發(fā)現(xiàn)錯(cuò)誤。至于安裝,同樣打開插件擴(kuò)展窗口輸入eslint點(diǎn)擊安裝插件,裝好后也需要進(jìn)行配置,在同vetur插件一樣的地方進(jìn)行配置
"eslint.validate": [ "javascript", "javascriptreact", "html", "vue" ], "eslint.options": { "plugins": ["html"] }
etur和eslint插件在配置中如下圖所示
導(dǎo)入項(xiàng)目并編譯
1、導(dǎo)入項(xiàng)目
從github上下載vuestic-admin項(xiàng)目(https://github.com/epicmaxco/vuestic-admin.git),拉到本地后打開VSCode直接文件->打開文件夾 導(dǎo)入項(xiàng)目,Ctrl+shift+Y呼出控制臺,在控制臺終端輸入npm install添加包依賴
如果沒有安裝npm請先安裝npm。
2、運(yùn)行項(xiàng)目
同樣在終于執(zhí)行npm run dev代表開始運(yùn)行項(xiàng)目,這條命令會自動在瀏覽器上運(yùn)行項(xiàng)目,運(yùn)行結(jié)果如下圖所示,代表配置成功了。
以上所述是小編給大家介紹的VSCode配置啟動Vue項(xiàng)目詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
elementui 開始結(jié)束時(shí)間可以選擇同一天不同時(shí)間段的實(shí)現(xiàn)代碼
這篇文章主要介紹了elementui 開始結(jié)束時(shí)間可以選擇同一天不同時(shí)間段的實(shí)現(xiàn)代碼,需要先在main.js中導(dǎo)入相應(yīng)代碼,代碼簡單易懂,需要的朋友可以參考下2024-02-02如何用VUE和Canvas實(shí)現(xiàn)雷霆戰(zhàn)機(jī)打字類小游戲
這篇文章主要介紹了如何用VUE和Canvas實(shí)現(xiàn)雷霆戰(zhàn)機(jī)打字類小游戲,麻雀雖小,五臟俱全,對游戲感興趣的同學(xué),可以參考下,研究里面的原理和實(shí)現(xiàn)方法2021-04-04vue插件mescroll.js實(shí)現(xiàn)移動端上拉加載和下拉刷新
這篇文章主要介紹了vue插件mescroll.js實(shí)現(xiàn)移動端上拉加載和下拉刷新,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-03-03