Svelte compiler - sourcemaps not usable

[nicomouss]

Describe the bug

Using Svelte 5.37.3, while trying to consume the sourcemaps generated by the svelte compiler, I constantly get errors popping out, similar to Error parsing mappings: the mappings contained a negative line, column, source index, or name index.

Let's say I have a very simple svelte file:

<script lang="ts">
  const message = "hello";
</script>

<p>
  {message}
</p>

Then compiling the component, and consuming the sourcemaps:

const filename = "path/to/the/svelte/component";

// Loading source
const source = fs.readFileSync(filename, {
    encoding: "utf-8",
});

// Compiling works fine
const compileResult = compile(source, {
    filename: filename,
});

// Consuming the sourcemaps does not work
// Here using source-map library (https://github.com/mozilla/source-map).
await SourceMapConsumer.with(
    compileResult.js.map,
    null,
    (consumer) => {
        consumer.eachMapping(function (m) {
            // ...
        });
    },
);

Consuming the sourcemaps leads to the error specified above.
It's happening whatever sourcemaps-consumer library I am using.

The component is so simple that I wonder if I am not missing something along the lines here. I tried various CompileOptions settings, without much success.

Is it indeed a bug ?

Thanks in advance for any hints.

Reproduction

See reproduction steps provided above.

Logs

System Info

System:
    OS: macOS 15.6
    CPU: (8) arm64 Apple M3
    Memory: 475.55 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.18.0 - ~/.n/bin/node
    npm: 10.9.3 - ~/.n/bin/npm
    pnpm: 10.14.0 - ~/.n/bin/pnpm
  Browsers:
    Chrome: 139.0.7258.67
    Safari: 18.6
  npmPackages:
    svelte: ^5.37.3 => 5.37.3

Severity

annoyance

[paoloricciuti]

While looking for this i found this website

https://pastcompute.github.io/ScriptMapper/

which is also using this library...I might be mistaken but i think the decoding still happens so if you try catch it you can still use the result (i think we are also using them in the playground)...what do you need sourcemaps for?

[nicomouss]

Thanks Paolo for your feedback.

That's not a big deal in my particular case, I just wanted to notify this potential bug on the svelte repo.
I am now using a different strategy (see explanation below), so that this problem is bypassed.

What do you need sourcemaps for

I am working on a library that will allow transparently use of Lingui internationalization features within svelte/svelkekit ecosystem, using modern runes reactivity under the hood.

Lingui comes up with a default extractor which is able to extract messages out of a codebase. What Lingui extractor is basically doing is parsing JS/TS source code, and extracting specific strings out of it. Those strings are persisted within a catalog in order to be localized.

In this specific case dealing with .svelte files, I wanted to reuse default Lingui extractor, that only knows to extract from JS/TS source files. By first compiling a .svelte file into JS, then feeding the compiled JS to the Lingui extractor, it works indeed fine.

Now, the default Lingui extractor also accepts a sourcemap, along with the provided JS source. So that it can relate back to the locations within an eventual original file (in this case, the .svelte one). By using the sourcemap created by svelte compiler, it should theoretically do the job.

Only to have the Error parsing mappings: the mappings contained a negative line, column, source index, or name index popping out whenever the sourcemap is used ...

In the end, I have created a proper extractor from scratch, which is able to deal with svelte files directly (aka without a compilation step, but by extracting messages directly out of the AST). Performance-wise, it's more efficient, and it's bypassing the sourcemap problem along the way.

[paoloricciuti]

Gotcha... I'm not really sure why there's a couple of extra transformations, probably some esrap stuff. I'll see if it's actually worth fixing this