feat(dev): merge source map for vue script block with lang='ts' (#345)

package.json

@@ -79,6 +79,7 @@
     "koa-static": "^5.0.0",
     "lru-cache": "^5.1.1",
     "magic-string": "^0.25.7",
+    "merge-source-map": "^1.1.0",
     "mime-types": "^2.1.27",
     "minimist": "^1.2.5",
     "open": "^7.0.3",

src/node/server/serverPluginVue.ts

@@ -34,6 +34,8 @@ import { codegenCss, compileCss, rewriteCssUrls } from '../utils/cssUtils'
 import { parse } from '../utils/babelParse'
 import MagicString from 'magic-string'
 import { resolveImport } from './serverPluginModuleRewrite'
+import merge from 'merge-source-map'
+import { RawSourceMap } from 'source-map'
 
 const debug = require('debug')('vite:sfc')
 const getEtag = require('etag')
@@ -405,8 +407,14 @@ async function compileSFCMain(
   if (descriptor.script) {
     let content = descriptor.script.content
     if (descriptor.script.lang === 'ts') {
-      // TODO merge lang=ts source map
-      content = (await transform(content, publicPath, { loader: 'ts' })).code
+      const { code, map } = await transform(content, publicPath, {
+        loader: 'ts'
+      })
+      content = code
+      descriptor.script.map = merge(
+        descriptor.script.map!,
+        JSON.parse(map!)
+      ) as RawSourceMap
     }
     // rewrite export default.
     // fast path: simple regex replacement to avoid full-blown babel parse.

src/node/utils/shims.d.ts

@@ -0,0 +1,3 @@
+declare module 'merge-source-map' {
+  export default function merge(oldMap: object, newMap: object): object
+}