Svelte Rollup unexpected error on type import

Question

I am trying to build my Svelte-Component which is written in typescirpt. I am using rollup and keep getting the error message

   [!] (plugin svelte) ParseError: Unexpected token
      import type { Point } from './../typings/Point';

Apparantly there seems to be Problem with the 'type' import.

rollup.config.js:

import svelte from "rollup-plugin-svelte";
import resolve from "rollup-plugin-node-resolve";
import postcss from "rollup-plugin-postcss";
import peerDepsExternal from "rollup-plugin-peer-deps-external";
import typescript from "rollup-plugin-typescript2";
import json from "@rollup/plugin-json";

const pkg = require("./package.json");

export default {
  input: "src/index.tsx",
  output: [
    { file: pkg.module, format: "en" },
    { file: pkg.main, format: "umd", name: "Name" },
  ],
  plugins: [
    json({ compact: true }),
    svelte(),
    resolve(),
    typescript({ useTsconfigDeclarationDir: false }),
    peerDepsExternal(),
    postcss({
      extensions: [".css"],
    }),
  ],
};

tsconfig.json

{
  "extends": "@tsconfig/svelte/tsconfig.json",
   "include": ["src/**/*"],
  "exclude": ["node_modules/*", "__sapper__/*", "public/*"],
  "compilerOptions": {
    "target": "es2016",
    "module": "esnext",
    "outDir": "dist",
    "strict": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "importsNotUsedAsValues": "remove"
}

Answer 1

You need to integrate svelte-preprocess (see usage documentation) and define the script language in the components:

<script lang="ts">