svelte 3 typescript: Unexpected tokensvelte(parse-error)

user_1747336 0
Viewed 2882

I'm new to svelte and I would like to try it with typescript by following the official guideline. I have generated the project and haven't done any change to my code. But I'm getting an (linting?) error from vscode editor (generated file App.svelte):

enter image description here

Any help would be greatly appreciated.

  • vscode: Version: 1.47.3,
  • vscode svelte (official extension): v101.4.0
  • node: v12.14.0

package.json (partial):

"devDependencies": {
    "@rollup/plugin-commonjs": "^12.0.0",
    "@rollup/plugin-node-resolve": "^8.0.0",
    "rollup": "^2.3.4",
    "rollup-plugin-livereload": "^1.0.0",
    "rollup-plugin-svelte": "^5.0.3",
    "rollup-plugin-terser": "^5.1.2",
    "svelte": "^3.0.0",
    "svelte-check": "^0.1.0",
    "svelte-preprocess": "^4.0.0",
    "@rollup/plugin-typescript": "^4.0.0",
    "typescript": "^3.9.3",
    "tslib": "^2.0.0",
    "@tsconfig/svelte": "^1.0.0"
  },
  "dependencies": {
    "sirv-cli": "^1.0.0"
  }

tsconfig.json:

{
  "extends": "@tsconfig/svelte/tsconfig.json",

  "include": ["src/**/*"],
  "exclude": ["node_modules/*", "__sapper__/*", "public/*"],
}
svelte-3 typescript
1 Answers

If you have previously used the old svelte extension

This error is likely due to a conflict between the old, unofficial svelte vscode extension and the new, official one. Since the older extensions has been removed from the marketplace it is no longer visible in your list of extensions, however it can still be there on your hard disk.

Go the the extensions folder located on your PC

  • Windows (powershell) ~\.vscode\extensions
  • macOS / Linux ~/.vscode/extensions
  • Linux if using WSL ~/.vscode-server/extensions/

And check if you have two svelte extensions installed, if so,

  • Remove the jamesbirtles.svelte-vscode-(version) folder

  • Keep the svelte.svelte-vscode-(version) folder

Then restart VScode

user_119561070
Related