fix: generate correct source-map when content is not padded (#52)

Author: znck

lib/parse.ts

@@ -1,3 +1,4 @@
+import { SourceMapGenerator } from 'source-map'
 import {
   RawSourceMap,
   VueTemplateCompiler,
@@ -6,7 +7,6 @@ import {
 
 const hash = require('hash-sum')
 const cache = require('lru-cache')(100)
-const { SourceMapGenerator } = require('source-map')
 
 const splitRE = /\r?\n/g
 const emptyRE = /^(?:\/\/)?\s*$/
@@ -48,7 +48,7 @@ export function parse(options: ParseOptions): SFCDescriptor {
     source,
     filename = '',
     compiler,
-    compilerParseOptions = { pad: 'line' },
+    compilerParseOptions = { pad: 'line' } as VueTemplateCompilerParseOptions,
     sourceRoot = '',
     needMap = true
   } = options
@@ -62,7 +62,8 @@ export function parse(options: ParseOptions): SFCDescriptor {
         filename,
         source,
         output.script.content,
-        sourceRoot
+        sourceRoot,
+        compilerParseOptions.pad
       )
     }
     if (output.styles) {
@@ -72,7 +73,8 @@ export function parse(options: ParseOptions): SFCDescriptor {
             filename,
             source,
             style.content,
-            sourceRoot
+            sourceRoot,
+            compilerParseOptions.pad
           )
         }
       })
@@ -86,19 +88,28 @@ function generateSourceMap(
   filename: string,
   source: string,
   generated: string,
-  sourceRoot: string
+  sourceRoot: string,
+  pad?: 'line' | 'space'
 ): RawSourceMap {
   const map = new SourceMapGenerator({
     file: filename.replace(/\\/g, '/'),
     sourceRoot: sourceRoot.replace(/\\/g, '/')
   })
+  let offset = 0
+  if (!pad) {
+    offset =
+      source
+        .split(generated)
+        .shift()!
+        .split(splitRE).length - 1
+  }
   map.setSourceContent(filename, source)
   generated.split(splitRE).forEach((line, index) => {
     if (!emptyRE.test(line)) {
       map.addMapping({
         source: filename,
         original: {
-          line: index + 1,
+          line: index + 1 + offset,
           column: 0
         },
         generated: {
@@ -108,5 +119,5 @@ function generateSourceMap(
       })
     }
   })
-  return map.toJSON()
+  return JSON.parse(map.toString())
 }

package.json

@@ -59,7 +59,7 @@
     "postcss": "^7.0.7",
     "postcss-selector-parser": "^5.0.0",
     "prettier": "1.16.0",
-    "source-map": "^0.7.3",
+    "source-map": "~0.6.1",
     "vue-template-es2015-compiler": "^1.6.0"
   }
 }

yarn.lock

@@ -4725,6 +4725,11 @@ [email protected]:
   dependencies:
     amdefine ">=0.0.4"
 
+[email protected], source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
+  version "0.6.1"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
+
 source-map@^0.4.2:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
@@ -4737,16 +4742,6 @@ source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7, source-map@~0.5.1:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
   integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
 
-source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
-  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
-
-source-map@^0.7.3:
-  version "0.7.3"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
-  integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==
-
 spdx-correct@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"