sv-strip

sv-strip

A type stripper for Svelte.

pnpm install sv-strip

import { strip } from 'sv-strip';

const ts = `<script lang="ts">
    let value = $state<string>('');
</script>`

const js = strip(ts);

In

<script lang="ts">
    type Foo = number

    let value = $state<Foo>('');
</script>

<input bind:value/>

Out

<script>
    let value = $state('');
</script>

<input bind:value/>

Formatting

By default sv-strip will remove leading and trailing whitespace when removing nodes. This will result in an output that is correctly formatted (with a small performance penalty).

If you are doing your own formatting you can disable this behavior with the format option like so:

const js = strip(ts, { format: false });

Empty Script Tags

Empty script tags can be created as a side effect of removing types or because there was an empty script tag just to enable TypeScript for the template.

In any case they serve no use in the output code and will be removed by default. You can disable this behavior with the removeEmptyScripts option like so:

const js = strip(ts, { removeEmptyScripts: false });

Limitations

Formatting

While sv-strip includes a format option it is not a formatter. It will do it's best to maintain the formatting of the original code when stripping types but it is still recommended to use your own formatter if possible.

Unsupported Syntax

• ❌ Enums

enum Foo {
    Bar
}

• ❌ Constructor Parameter Properties

class Foo {
    // the access modifier (public) is not allowed
    constructor(public bar) {

    }
}

Contributing

Install dependencies:

pnpm install

Run tests:

pnpm test

Add a changeset with your changes:

pnpm changeset

Finally before you commit your changes run:

pnpm format

pnpm check

Tests

If you are contributing please make sure to include tests.

All the test cases can be found under ./tests/cases.

Each case is a folder with 2 files a ts.svelte and a js.svelte. js.svelte should be the stripped version of the ts.svelte. If you don't provide js.svelte then vitest will expect strip to error.

Example test case

tests
└── cases
    ├── <your test name>
    │   ├── js.svelte
    │   └── ts.svelte
    └── ...