CODEWITHSUNDEEP
vue.jsvisual-studio-codeeslintprettier
Thed
Thed

Reputation: 175

Is this vue js html line split by Prettier or ESLint in VSCode

When I save my Vue JS component in VSCode the template code shown below is split from a single line into two or more, depending on the length of the "Load Depot.." string.

Sometimes, depending on the length of the string it splits in the middle of the quotes and breaks my code.

I have both ESLint or Prettier enabled in the project, but I don't know which one is responsible for this and how to fix it.


    <h4>Depot Edit - {{ route.params.code }}, {{ depotStore.currentDepot ? depotStore.currentDepot.name : "Loading..." }} </h4>

This receives a line break in an inconvenient location


    <h4>Depot Edit - {{ route.params.code }}, {{ depotStore.currentDepot ? depotStore.currentDepot.name : "Loading 
Depot..." 
}} </h4>

Upvotes: 0

Views: 1079

Answers (1)

Ying-Shan Lin
Ying-Shan Lin

Reputation: 894

You can check your VSCode formatter by Ctrl + Shift + P, search Format Document ... then choose the formatter which you want.

Second, you can install Prettier ESLint - Visual Studio Marketplace. It makes Prettier work with ESlint.

Upvotes: 3

Related Questions