The CSS sourcemap is wrong while using TypeScript

[idiotWu]

Problem

When using the sveltejs/template-webpack with TypeScript enabled, the inline CSS source map goes wrong and source contents can't be loaded.

Steps to Reproduce

1. clone the template: git clone [email protected]:sveltejs/template-webpack.git
2. run npm install
3. run node scripts/setupTypeScript.js
4. run npm install again
5. run npm run dev
6. open http://localhost:8080/ with Chrome
7. open the devtool and inspect the <h1> element
8. click source link in the Style panel:

9. you can see an error message in the Sources tab: Could not load content for http://localhost:8080/src/App.svelte (HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE)

Possible Cause

I tried parsing the inline sourcemap inside <style> element, and it seems that sourcesContent property is missing:

[benmccann]

We just released a new version of svelte-loader that I believe fixes this

[idiotWu]

@benmccann no, after updating svelte-loader to 3.1.2, this issue is still happening.

[idiotWu]

Source maps work by commenting out the following line, which is added in #172

svelte-loader/index.js

Line 48 in 5e7853f

if (processed.map) compileOptions.sourcemap = processed.map;