Svelte component with typescript in another file not linting-CodePudding

I separated my .svelte, .ts and .scss in 3 distinct file eveything work but the linting in VSCode isn't working

screenshot

CodePudding user response：

If you want to import it from a seperate file, you can use ES6 imports and exports to do this:

// main.ts
export let username: string = "..."

<script lang="ts">
  import { username } from "./main.ts"
</script>

<h1>{username}</h1> <!-- works! -->

Svelte's tutorials, however, (unless the script file is very big), usually inline the script into the .svelte file as so:

<script lang="ts">
  let username: string = "..."
</script>

<h1>{username}</h1>

However, the way you're doing it can not be done with a svelte component. If you're trying to import an external JS file, you can put it in your index.html file or find the proper library that will import it for you.

CodePudding user response：

You cannot separate script code from a Svelte component like this.

All variables that are part of the template have to be in the file, otherwise you will lose all reactivity (unless you use module import statements and work exclusively with stores). You also would not be able to declare component properties.

Just do not do this.