vscode中prettier和eslint換行縮進(jìn)沖突的問(wèn)題
更新時(shí)間：2023年10月20日 10:17:12 作者：Simorel
這篇文章主要介紹了vscode中prettier和eslint換行縮進(jìn)沖突的問(wèn)題及解決,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
prettier
Javascript
// Input
const example1 =
someValue === 'a' ? 'hello world, branch a'
: someValue === 'b' ? 'hello world, branch a && b'
: someValue === 'c' ? 'hello world, branch a && b && c'
: someValue === 'd' ? 'hello world, branch a && b && c && d'
: null;
const example2 =
someValue === 'a'
? someValue === 'b'
? someValue === 'c'
? 'hello world, branch a && b && c'
: 'hello world, branch a && b && !c'
: 'hello world, branch a && !b'
: null;
// Output (Prettier 1.14)
const example1 =
someValue === "a"
? "hello world, branch a"
: someValue === "b"
? "hello world, branch a && b"
: someValue === "c"
? "hello world, branch a && b && c"
: someValue === "d"
? "hello world, branch a && b && c && d"
: null;
const example2 =
someValue === "a"
? someValue === "b"
? someValue === "c"
? "hello world, branch a && b && c"
: "hello world, branch a && b && !c"
: "hello world, branch a && !b"
: null;
// Output (Prettier 1.15)
const example1 =
someValue === "a"
? "hello world, branch a"
: someValue === "b"
? "hello world, branch a && b"
: someValue === "c"
? "hello world, branch a && b && c"
: someValue === "d"
? "hello world, branch a && b && c && d"
: null;
const example2 =
someValue === "a"
? someValue === "b"
? someValue === "c"
? "hello world, branch a && b && c"
: "hello world, branch a && b && !c"
: "hello world, branch a && !b"
: null;
異常展示
prettier 格式化后輸出結(jié)果
<div
v-if="
statusSetting.a === element.status ||
statusSetting.b === element.status
"
class="ticket__background"
/>
eslint沖突輸出結(jié)果
<div
v-if="
statusSetting.a === element.status ||
statusSetting.b === element.status
"
class="ticket__background"
/>
解決方案
方案一
工作區(qū)禁用eslint
方案二
修改 vscode 配置
/** 保存文檔時(shí)自動(dòng)格式化 */
"editor.formatOnSave": false,
/** 保存時(shí)按照哪個(gè)規(guī)則進(jìn)行格式化(上面的保存文檔時(shí)自動(dòng)格式化必須關(guān)閉否則會(huì)有沖突) */
"editor.codeActionsOnSave": {
"source.fixAll": true,
},
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue實(shí)現(xiàn)個(gè)人信息查看和密碼修改功能
本文通過(guò)實(shí)例代碼給大家介紹了vue實(shí)現(xiàn)個(gè)人信息查看和密碼修改功能，文中給大家補(bǔ)充介紹了vue實(shí)現(xiàn)密碼顯示隱藏切換功能，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，感興趣的朋友一起看看吧2018-05-05
Vue之版本升級(jí)后不兼容的問(wèn)題及解決過(guò)程
本文將探討 Vue 版本升級(jí)后常見(jiàn)的不兼容問(wèn)題,并提供相應(yīng)的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2025-03-03
使用vue-router切換頁(yè)面時(shí)實(shí)現(xiàn)設(shè)置過(guò)渡動(dòng)畫
今天小編就為大家分享一篇使用vue-router切換頁(yè)面時(shí)實(shí)現(xiàn)設(shè)置過(guò)渡動(dòng)畫。具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-10-10
vue-simple-verify實(shí)現(xiàn)滑動(dòng)驗(yàn)證碼功能
登錄頁(yè)面經(jīng)常會(huì)需要滑動(dòng)驗(yàn)證碼的情況,使用vue插件vue-simple-verify就可以輕松實(shí)現(xiàn),下面小編給大家分享vue-simple-verify實(shí)現(xiàn)滑動(dòng)驗(yàn)證碼功能,感興趣的朋友一起看看吧2024-06-06
Vue scrollBehavior 滾動(dòng)行為實(shí)現(xiàn)后退頁(yè)面顯示在上次瀏覽的位置
這篇文章主要介紹了Vue scrollBehavior 滾動(dòng)行為實(shí)現(xiàn)后退頁(yè)面顯示在上次瀏覽的位置，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-05-05
解決Vue運(yùn)算符報(bào)錯(cuò):Syntax Error: Unexpected token問(wèn)題
這篇文章主要介紹了解決Vue運(yùn)算符報(bào)錯(cuò):Syntax Error: Unexpected token問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-01-01
深入理解vue輸入框字符限制的優(yōu)化設(shè)計(jì)方案
限制輸入框字符是一項(xiàng)需要結(jié)合技術(shù)實(shí)現(xiàn)與用戶體驗(yàn)的綜合設(shè)計(jì),通過(guò)實(shí)時(shí)限制、提交校驗(yàn)與性能優(yōu)化,開(kāi)發(fā)者可以高效解決輸入限制問(wèn)題,同時(shí)提升用戶滿意度和數(shù)據(jù)安全性,本文給大家介紹vue輸入框字符限制的優(yōu)化設(shè)計(jì),感興趣的朋友跟隨小編一起看看吧2024-12-12
這篇文章主要介紹了Vue中keep-alive的兩種應(yīng)用方式，文中講解非常細(xì)致，代碼幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下2020-07-07
vue.config.js配置報(bào)錯(cuò)解決辦法(可能是與webpack混淆)
在Vue.js開(kāi)發(fā)過(guò)程中,vue.config.js文件是用于配置項(xiàng)目的,特別是對(duì)于開(kāi)發(fā)環(huán)境的設(shè)置,這篇文章主要給大家介紹了關(guān)于vue.config.js配置報(bào)錯(cuò)解決的相關(guān)資料,可能是與webpack混淆,需要的朋友可以參考下2024-06-06
這篇文章主要介紹了vue鍵盤事件keyup、keydown的作用,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-12-12