Input source map from vue-loader is not properly merged, breaks debugging

[lephuongbg]

Describe the bug

Even though swc-loader seems to be passing the inputSourceMap to swc correctly, the output source map of swc does not contain any of the original source map, thus breaks debugging in browser's dev console.

Input code

Config

// swc-loader options
{
    sourceMap: true,
    env: {
        targets: ['last 2 chrome versions'],
    },
    jsc: {
        parser: {
            syntax: 'typescript',
            tsx: true,
            dynamicImport: true,
        },
        transform: {react: {pragma: 'h'}},
    },
}

Expected behavior

Input source map from vue-loader and source map from swc should be merged properly.

Given this original source map from vue-loader:

Original source map

{
  version: 3,
  sources: [ 'App.vue' ],
  names: [],
  mappings: ';;;;;;;;AAQA;;AAEA;AACA;AACA;AACA;AACA;AACA',
  file: 'App.vue',
  sourceRoot: 'src',
  sourcesContent: [
    '<template>\n' +
      '  <div id="app">\n' +
      '    <img alt="Vue logo" src="./assets/logo.png">\n' +
      '    <HelloWorld msg="Welcome to Your Vue.js App"/>\n' +
      '  </div>\n' +
      '</template>\n' +
      '\n' +
      '<script>\n' +
      "import HelloWorld from './components/HelloWorld.vue'\n" +
      '\n' +
      'export default {\n' +
      "  name: 'App',\n" +
      '  components: {\n' +
      '    HelloWorld\n' +
      '  }\n' +
      '}\n' +
      '</script>\n' +
      '\n' +
      '<style>\n' +
      '#app {\n' +
      '  font-family: Avenir, Helvetica, Arial, sans-serif;\n' +
      '  -webkit-font-smoothing: antialiased;\n' +
      '  -moz-osx-font-smoothing: grayscale;\n' +
      '  text-align: center;\n' +
      '  color: #2c3e50;\n' +
      '  margin-top: 60px;\n' +
      '}\n' +
      '</style>\n'
  ]
}

This is what babel outputs:

Compiled code

//
//
//
//
//
//
//
import HelloWorld from './components/HelloWorld.vue';
export default {
  name: 'App',
  components: {
    HelloWorld: HelloWorld
  }
};

Output source map

{
  version: 3,
  sources: [ 'App.vue' ],
  names: [],
  mappings: ';;;;;;;AAQA,OAAA,UAAA,MAAA,6BAAA;AAEA,eAAA;AACA,EAAA,IAAA,EAAA,KADA;AAEA,EAAA,UAAA,EAAA;AACA,IAAA,UAAA,EAAA;AADA;AAFA,CAAA',
  sourcesContent: [
    '<template>\n' +
      '  <div id="app">\n' +
      '    <img alt="Vue logo" src="./assets/logo.png">\n' +
      '    <HelloWorld msg="Welcome to Your Vue.js App"/>\n' +
      '  </div>\n' +
      '</template>\n' +
      '\n' +
      '<script>\n' +
      "import HelloWorld from './components/HelloWorld.vue'\n" +
      '\n' +
      'export default {\n' +
      "  name: 'App',\n" +
      '  components: {\n' +
      '    HelloWorld\n' +
      '  }\n' +
      '}\n' +
      '</script>\n' +
      '\n' +
      '<style>\n' +
      '#app {\n' +
      '  font-family: Avenir, Helvetica, Arial, sans-serif;\n' +
      '  -webkit-font-smoothing: antialiased;\n' +
      '  -moz-osx-font-smoothing: grayscale;\n' +
      '  text-align: center;\n' +
      '  color: #2c3e50;\n' +
      '  margin-top: 60px;\n' +
      '}\n' +
      '</style>\n'
  ],
  sourceRoot: 'src'
}

This is what swc outputs:

Compiled code

//
//
//
//
//
//
//
import HelloWorld from './components/HelloWorld.vue';
export default {
    name: 'App',
    components: {
        HelloWorld: HelloWorld
    }
};

Output source map

{
  version: 3,
  sources: [ '/tmp/test-project/src/App.vue', 'src/App.vue' ],
  sourcesContent: [
    '//\n' +
      '//\n' +
      '//\n' +
      '//\n' +
      '//\n' +
      '//\n' +
      '//\n' +
      '\n' +
      "import HelloWorld from './components/HelloWorld.vue'\n" +
      '\n' +
      'export default {\n' +
      "  name: 'App',\n" +
      '  components: {\n' +
      '    HelloWorld\n' +
      '  }\n' +
      '}\n',
    null
  ],
  names: [],
  mappings: 'AAAA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;OCEA,UAAA,OAAA,2BAAA;;AAIA,QAAA,GAAA,GAAA;AACA,cAAA;AACA,kBAAA,EAAA,UAAA'
}

Notice that sourcesContent, sourcesRoot and sources were not taken from the original source map.

Version
The version of @swc/core: 1.2.47

Additional context

Relevant issue:

vuejs/vue-loader#1163
babel/babel#7761

[swc-bot]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.