詳解VScode編輯器vue環(huán)境搭建所遇問題解決方案
前言
為什么選擇VScode？
在之前我用過sublime、webstorm、atom、Brackets、eclipse、HBuilder、notepad++等等。應(yīng)該還有一些用過幾次的編輯器，記不起來的，這些編輯器的作用不外乎一點(diǎn)——為了開發(fā)迅速?；径紩詭Тa提示插件。隨著項(xiàng)目越來越大，出了一系列問題，而這些問題會大量浪費(fèi)我們的時間（我們只想簡單的編程），故而編輯器插件的數(shù)量和支持程度成為了我們選擇編輯器的重要條件，這就是為什么選擇VScode，它擁有大量的插件，可以幫助我們完成我們沒必要浪費(fèi)時間去做的一些事情，比如代碼縮緊，追加分號等等。
VScode的優(yōu)勢
- 擁有大量的插件供我們選擇
- 跨平臺可用，支持mac和windows
- 簡單配置，json語法，開發(fā)通用
- 主題換膚，隨心所欲
- vue常用(或非常用)插件介紹
vetur：用于vue語法高亮
prettier：格式化代碼
ESLint：代碼檢查
Beautify：代碼美化插件，格式化html
目前這幾款插件就夠用了！后續(xù)在補(bǔ)充其他插件
配置插件常見問題匯總
iview的標(biāo)簽報錯 x-invalid-end-tag
{
“vetur.validation.template”: false
}
格式化代碼的時候template里的標(biāo)簽屬性也換行（Ps. 屬性不換行）
{
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto"
},
"prettyhtml": {
"printWidth": 120,
"singleQuote": false,
"wrapAttributes": false,
"sortAttributes": false
}
}
}
保存自動格式化不生效
{
// 需要自動保存的必須配置autoFix
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
}
],
// 保存自動修復(fù)
"eslint.autoFixOnSave": true,
}
以上所述是小編給大家介紹的了VScode編輯器vue環(huán)境搭建所遇問題解決方案詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
插槽就是子組件中的提供給父組件使用的一個占位符，用<slot></slot> 表示，父組件可以在這個占位符中填充任何模板代碼，如 HTML、組件等，填充的內(nèi)容會替換子組件的<slot></slot>標(biāo)簽，這篇文章主要介紹了Vue插槽的理解和使用,需要的朋友可以參考下2023-03-03
Vue提供了豐富的API和組件，可以幫助開發(fā)者快速地構(gòu)建現(xiàn)代化的Web應(yīng)用程序，本文介紹了Vue如何實(shí)現(xiàn)分頁功能，包括數(shù)據(jù)的獲取、分頁器的實(shí)現(xiàn)和頁面的渲染2023-09-09
VueX如何實(shí)現(xiàn)數(shù)據(jù)共享
這篇文章主要介紹了VueX如何實(shí)現(xiàn)數(shù)據(jù)共享問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了搭建vue開發(fā)環(huán)境的方法，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下2018-07-07
vue2?自定義?el-radio-button?的樣式并設(shè)置默認(rèn)值的方法
這篇文章主要介紹了vue2?自定義?el-radio-button?的樣式并設(shè)置默認(rèn)值的操作方法，代碼分為html部分和css修改樣式代碼，代碼簡單易懂，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-10-10
這篇文章主要介紹了Vue中如何設(shè)置全局的cookie對象，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
vue3自定義確認(rèn)密碼匹配驗(yàn)證規(guī)則的操作代碼
這篇文章主要介紹了vue3自定義確認(rèn)密碼匹配驗(yàn)證規(guī)則的操作代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-01-01
多個vue項(xiàng)目復(fù)用一個node_modules的問題
這篇文章主要介紹了多個vue項(xiàng)目復(fù)用一個node_modules的問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
Vue中實(shí)現(xiàn)權(quán)限控制的方法示例
這篇文章主要介紹了Vue中實(shí)現(xiàn)權(quán)限控制的方法示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
詳解Vue.js之視圖和數(shù)據(jù)的雙向綁定(v-model)
本篇文章主要介紹了Vue.js之視圖和數(shù)據(jù)的雙向綁定(v-model)，使用v-model指令,使得視圖和數(shù)據(jù)實(shí)現(xiàn)雙向綁定，有興趣的可以了解一下2017-06-06