vue.jsformatvuejs3eslintprettier

Vue: Auto-format/lint: move <script> before <template> tags

Is there a way to configure ESLint/Prettier or similar tooling to automatically refactor .vue files in a way that <script> tag will be moved to the beginning of the file above the <template> tag?

From:

<template>
  …
</template>

<script>
  …
</script>

To:

<script>
  …
</script>

<template>
  …
</template>
Solution

  • There is a eslint rule for that: vue/component-tags-order