Svelte2tsx screenshot

Svelte2tsx

Author Avatar Theme by Halfnelson
Updated: 21 May 2020
25 Stars

Convert svelte components to TSX for type checking

Overview

The Svelte2tsx project is a code converter that converts Svelte component source code into TSX (TypeScript + JSX) format. By using this converter, developers can easily type check their Svelte components using the included svelte-jsx.d.ts and svelte-shims.d.ts files. It is important to note that this project converts Svelte to TSX only, and the responsibility of type checking is left to the consumers of this plugin, such as language services.

Features

  • Svelte to TSX Conversion: Converts Svelte component source code into TSX format.
  • Included Type Definitions: Provides svelte-jsx.d.ts and svelte-shims.d.ts files for easy type checking of converted TSX code.
  • Source Map Support: Generates a v3 SourceMap that provides a mapping back to the original Svelte source code.

Installation

To install the Svelte2tsx converter, follow these steps:

  1. Clone the Svelte language tools monorepo from https://github.com/sveltejs/language-tools.
  2. Navigate to the packagessvelte2tsx folder in the cloned repository.
  3. Install the required dependencies by running the following command:
    npm install
    

Summary

The Svelte2tsx project is a useful code converter that allows developers to convert Svelte component source code into TSX format for easy type checking. It provides svelte-jsx.d.ts and svelte-shims.d.ts files for seamless integration with TypeScript. The converter also generates a v3 SourceMap that helps in mapping back to the original Svelte source code. Overall, the Svelte2tsx project simplifies the process of using Svelte components with TypeScript, enhancing the development experience for Svelte developers.