ESLint conflict?

First of all, thanks for this amazing template. Not only is it easy to get started mocking up new application with this, but it’s also taught me a million things about different aspects of Vite and Vue.

I have noticed one small issue, though I’m not 100% sure it’s due to my VSCode or due to a conflict in rulesets for ESLint/formatting.

Out of the box, in the file index.vue, there is the following ESLint warning:

Expected 1 line break after opening tag (<button>), but no line breaks found.

When saving, it tries to auto fix this by placing the content between opening and closing tag on the next line, which is good, but it then immediately reverts to how it was before in a split second. Is this a case of two successive formatters doing opposite things? If this has nothing to do with your template and it’s my own setup causing this, just tell me and I’ll look for a deeper cause in my own VSCode.

Thanks again for all the hard work at giving Vite such a huge boost from the get-go!

[Ragura]

Hello, @Ragura I am having hard timing configuring Volar + ESLint for formatting. Can you please share a minimal vite-vue-ts setup with ESLint & Volar formatting?

Regards.

Hi @jd-0001, I’m using the default extension settings, together with the tsconfig.json that came with the Vitesse template. Just make sure VS Code is actually using ESLint to do the formatting, else you’ll get warnings about the formatting, but it won’t correct them automatically.

[jd-solanki]

Hello, @Ragura I am having hard timing configuring Volar + ESLint for formatting. Can you please share a minimal vite-vue-ts setup with ESLint & Volar formatting?

Regards.