Cannot sort `<script setup>` if multiple `<script>` are provided in vue sfc
Tanimodori opened this issue · 2 comments
Tanimodori commented
Your Environment
- prettier-plugin-sort-imports: 4.1.1
- Prettier version: 2.8.4
- node version: 16.19.0
- package manager: pnpm@7.16.1
- IDE: VScode
- prettier-plugin-sort-imports: 4.1.1
- OS: Windows 11
Describe the bug
If multiple <script>
blocks are provided in vue sfc, the <script setup>
block will be ignored where imports inside are not sorted while other prettier functions still work.
It is common that both <script>
and <script setup>
are required in the same sfc (e.g. you need to use defineComponent
to define the name of the component, or exports something from sfc).
To Reproduce
git clone https://github.com/Tanimodori/prettier-import-vue-repro.git
cd prettier-import-vue-repro
pnpm i
pnpm format
- inspect diff of
src/App.vue
. The imports in<script setup>
are not sorted.
Expected behavior
The imports in <script setup>
should also be sorted.
Screenshots, code sample, etc
<script lang="ts">
import { dummy } from './dummy'
import { ref } from 'vue'
export const foo = ref(dummy)
</script>
<script setup lang="ts">
import HelloWorld from './components/HelloWorld.vue'
import TheWelcome from './components/TheWelcome.vue'
import { computed } from 'vue'
const bar = computed(() => foo.value)
</script>
Configuration File (cat .prettierrc, prettier.config.js, .prettier.js)
Error log
N/A
Contribute to @trivago/prettier-plugin-sort-imports
- I'm willing to fix this bug 🥇
Tanimodori commented
I suppose this is causing the problem.