ESM loader for Svelte

This project builds on the projects listed below

It adds support for running the loader programmatically. Ie. the loader can be extended with custom options:

// my-custom-loader.js
import { svelteLoader } from "svelte-esm-loader/loader.js"

const { resolve, getFormat, getSource, transformSource } =
    await svelteLoader({/** options */})

export { resolve, getFormat, getSource, transformSource }

Additional options can be added as query strings on import:

import SsrComponent from './Component.svelte?generate=ssr'

For a full list of options, please refer to svelte/compiler options

// https://github.com/sveltejs/svelte/blob/master/src/compiler/interfaces.ts#L143-L171
export interface CompileOptions {
    format?: ModuleFormat;
    name?: string;
    filename?: string;
    generate?: 'dom' | 'ssr' | false;
    errorMode?: 'throw' | 'warn';
    varsReport?: 'full' | 'strict' | false;

    sourcemap?: object | string;
    enableSourcemap?: EnableSourcemap;
    outputFilename?: string;
    cssOutputFilename?: string;
    sveltePath?: string;

    dev?: boolean;
    accessors?: boolean;
    immutable?: boolean;
    hydratable?: boolean;
    legacy?: boolean;
    customElement?: boolean;
    tag?: string;
    css?: boolean;
    loopGuardTimeout?: number;
    namespace?: string;
    cssHash?: CssHashGetter;

    preserveComments?: boolean;
    preserveWhitespace?: boolean;
}

♥♥♥ and credit goes to Brev Patterson and Jerry Thomas who respectively created and extended this project.

Top categories

svelte logo

Want a Svelte site built?

Hire a Svelte developer
Loading Svelte Themes