Flashing semicolons in VSCode codeActionsOnSave organizeImports

[janosh]

When adding source.organizeImports to

  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": ["source.fixAll", "source.organizeImports"],

I get flashing semicolons on save in Svelte files but not in JS or TS files.

Screen.Recording.2021-11-21.at.09.38.07.mp4

[dummdidumm]

This does sound like it's an interop issue with ESLint and Prettier, because with Prettier alone I can't reproduce this. Could you please provide the steps and setup to reproduce this? Is this maybe a conflicting settings issue? Like, you tell ESLint to remove semicolons but according to your Prettier setting they should be added?

[janosh]

Steps

npm init svelte@next sort-imports

✔ Which Svelte app template? › Skeleton project
✔ Use TypeScript? … No
✔ Add ESLint for code linting? … Yes
✔ Add Prettier for code formatting? … Yes

cd sort-imports
npm install

Add "semi": false to .prettierrc:

{
	"useTabs": true,
	"singleQuote": true,
	"trailingComma": "none",
	"printWidth": 100,
	"semi": false
}

Add import to src/routes/index.svelte:

<script>
  import { onMount } from 'svelte'

  onMount(() => {})
</script>

Save file and observe flashing semicolon if "source.organizeImports" is set.

Works the same way if saying no to ESLint during npm init.

[dummdidumm]

This is an issue with the Svelte for VS Code. The "organize imports" code action returns semicolons at the end which is then overwritten afterwards. Transfering the issue to the right repository.