kit: TypeScript Error: No element indexed by 0

This is caused by Vite’s source map handling on .svelte files that are not dynamic files. As a temporary workaround, make sure to have src/routes/$layout.svelte with at least some “dynamic” content, e.g.

<slot />
{''}

Describe the bug As long as svelte-preprocess is used in svelte.config.cjs, attempting to run dev mode results in internal errors.

Logs With TypeScript, the page is a plaintext error:

Error: No element indexed by 0
    at ArraySet_at [as at] (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:24278:9)
    at BasicSourceMapConsumer.<anonymous> (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:25193:67)
    at Array.map (<anonymous>)
    at BasicSourceMapConsumer.SourceMapConsumer_eachMapping [as eachMapping] (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:25192:14)
    at merge (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:26656:18)
    at ssrTransform (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:61375:15)
    at transformRequest (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:61643:48)
    at async instantiateModule (C:\Users\GrygrFlzr\Documents\projects\sk-36\node_modules\vite\dist\node\chunks\dep-1bdbec90.js:67986:10)

To Reproduce

npm init svelte@next
# enable typescript
npm install
npm run dev

Expected behavior No errors out of the box.

Information about your SvelteKit Installation:

  npmPackages:
    @sveltejs/kit: next => 1.0.0-next.36
    svelte: ^3.29.0 => 3.35.0

Severity Unusable dev mode.

About this issue

Original URL
State: closed
Created 3 years ago
Comments: 26 (26 by maintainers)

Commits related to this issue

Add sources to combined map if needed When source maps are combined and the leading map is empty, sources is not set. Add the filename to the empty array in this case. Related https://github.com/svel... — committed to dummdidumm/svelte by deleted user 3 years ago

Most upvoted comments

I dug into this at well and I’m suspecting the Svelte compiler now and how it handles incoming sourcemap, or how that sourcemap is produced by Svelte’s preprocessor.

I noticed that when you run a preprocessor before compiling

the js.map is a class SourceMap instead of a JSON
that class has empty sources and sourcesContent arrays, whereas without preprocessing they are set and filled

EDIT: The reason is the empty sources. If I add the full file path to it manually before handing the map to vite, it works. The Svelte compiler seems to trip up there and not fill it if sourcemap is set. Or sourcemap contains a wrong sources content, which means the compiler’s preprocess function is at fault.

dummdidumm on Mar 12, 2021

I think @dummdidumm was talking about my last comment regarding the vite based preprocessor. We should discuss this elsewhere, i was merely offering another option to narrow down the issue.

It’s very possible the way how vite-plugin-svelte reads the svelte config or how the preprocessors+map are applied in compile is at fault here. (though i took the latter bits from rollup-plugin-svelte)

dominikg on Mar 11, 2021