Currently, I have a class implementation as follows:
class TestClass {
prop = $state('test');
}
This code works smoothly in files with the extension .svelte.js
, and .svelte
using
<script lang="js">
, but encounters issues in files with the extension .svelte.ts
, along with <script lang="ts">
.
An error message is thrown: "CompileError: $state(...) can only be used as a variable declaration initializer or a class field."
I'm wondering if it's an oversight on my part or if Svelte 5 hasn't added support for TypeScript class field states yet.
Below is the content of my tsconfig.json
file:
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"module": "es2020",
"lib": ["es2020", "dom"],
"target": "es2019",
"importsNotUsedAsValues": "error",
"isolatedModules": true,
"resolveJsonModule": true,
"sourceMap": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"baseUrl": ".",
"allowJs": true,
"checkJs": true,
"paths": {
....
}
},
"include": [
....
],
"exclude": ["node_modules/*"]
}