Error: Unsupported previous source map format: [object Object]

[Tidyzq]

Expected behavior

No error

Actual behavior

Emitted error but outputs seems are correct.

[ Error: Unsupported previous source map format: [object Object]
    at PreviousMap.loadMap (xxx/node_modules/postcss/lib/previous-map.js:142:23)
    at new PreviousMap (xxx/node_modules/postcss/lib/previous-map.js:63:25)
    at new Input (xxx/node_modules/postcss/lib/input.js:79:19)
    at parse (xxx/node_modules/postcss/lib/parse.js:21:17)
    at new LazyResult (xxx/node_modules/postcss/lib/lazy-result.js:70:24)
    at Processor.process (xxx/node_modules/postcss/lib/processor.js:117:12)
    at doCompileStyle (xxx/node_modules/@vue/component-compiler-utils/dist/compileStyle.js:42:35)
    at Object.compileStyle (xxx/node_modules/@vue/component-compiler-utils/dist/compileStyle.js:8:12)
    at SFCCompiler.compileStyle (xxx/node_modules/@vue/component-compiler/dist/compiler.js:104:51)
    at input.styles.descriptor.styles.map.style (xxx/node_modules/rollup-plugin-vue/dist/index.js:104:73)
    at Array.map (<anonymous>)
    at Object.<anonymous> (xxx/node_modules/rollup-plugin-vue/dist/index.js:104:51)
    at Generator.next (<anonymous>)
    at xxx/node_modules/rollup-plugin-vue/dist/index.js:7:71
    at new Promise (<anonymous>)
    at __awaiter (xxx/node_modules/rollup-plugin-vue/dist/index.js:3:12) ]

Steps to reproduce the behavior

Using multiple rollup configs and extract css with css: false will emit this error on the second build.

// rollup.config.js
import vue from 'rollup-plugin-vue';
import css from 'rollup-plugin-css-only';

export default [{
  input: 'main.js',
  output: {
    file: 'bundle.esm.js',
    format: 'esm',
  },
  plugin: [
    vue({
      css: false,
    }),
    css({
      output: 'bundle.css',
    }),
  ],
}, {
  input: 'main.js',
  output: {
    file: 'bundle.common.js',
    format: 'cjs',
    name: 'foo',
  },
  plugin: [
    vue({
      css: false,
    }),
    css({
      output: 'bundle.css',
    }),
  ],
}

[nandin-borjigin]

should be resolved in #243

[objectivehtml]

So after testing this change, I am still getting the error.

The error only happens however when I use --watch, and make a change to the CSS. This error use to occur when I made changed to parts of the template. The template never triggered a consistent error, and changes always ended up triggering the css. NOW, the CSS triggers an error after every single change but template seems fine.

Steps to reproduce this behavior

Using very similar config as above, but I have tested with only those plugins, I run rollup -c --watch. Open InputField.vue, add a single line of white space to the <style> section and get the following error:

Error: Multiple conflicting contents for sourcemap source ./src/Components/InputField/InputField.vue
Error: Multiple conflicting contents for sourcemap source ./src/Components/InputField/InputField.vue
    at error (./node_modules/rollup/dist/rollup.js:3460:30)
    at Link.traceMappings (./node_modules/rollup/dist/rollup.js:13581:25)
    at collapseSourcemaps (./node_modules/rollup/dist/rollup.js:13680:21)
    at ./node_modules/rollup/dist/rollup.js:14946:27

Note, I removed PostCSS, and copied index.ts from master and rebuilt and I still get this the following error.

[objectivehtml]

So a little more information on how to duplicate the above error, if I make a change to the file after running rollup -c --watch in the styles or template section I get the error. I only get the error with css: false. However, if I revert my changes to the original state, the error goes away since the content in the source map matches.

If I make the change again, I get the error. One thing I just noticed is when I make a change to the JS, then it recompiles the source map for the entire file and I don't get the error. I can make another CSS change and then get the error, change the JS and save, error goes away (and repeat).

Summary: it seems like any change to the template and/or CSS will result in a conflict source map until the JS file has changed which recompiles the source. Im still trying to get a handle on Rollup plugin debugging and dev, so still can't find erroneous code, but this should help duplicate it. I will post back if I figure how which line of code is causing this.

[znck]

@vue/component-compiler-utils produces conflicting source-map. It would be fixed there.

[znck]

Similar to #248, tracking there.