Rollup-plugin-vue: Error: Multiple conflicting contents for sourcemap source.

[Lee-Heisenbug]

Hi.
I was trying to use rollup to build a simple vue app. But an error occur every time I changed the style of a component.

I don't know how to fix it. Here is the project file: rollup-issue.zip

Steps to reproduce the behavior

1. Down load the project file.
2. run "npm i".
3. run "npm run watch".
4. make some change to the style block of ./src/app.vue. And the error will show up.

[Lee-Heisenbug]

It seems could be fixed by using old version(4.2.0) of rollup-plugin-vue.

[touho]

Thank you so much for sharing the solution! Hope this will be fixed in future releases.

[objectivehtml]

+1 Ran into this issue as well. I don't get this issue in all circumstances, but files that are nested in imports seem to cause an issue. If I get time I will try to see what could be causing this by comparing the code changes from 4.2.

I will say, it's really hard to not just rollback to older versions. I had zero issues with other builds. It's been a real struggle just to update my dev dependencies and get stuff that has been working for a year to build correctly. Hopefully i get some time to look into this if someone else can't fix this.

[BryceMehring]

Is there an update on this issue? Watching is currently not possible if source maps are enabled.

[kekeqy]

I have the same problem.This problem occurred when I used the 'router-link' tag to open a routing address with parameters.

[lovelyMonkey]

I have the same problem when save the vue file

[r4fx]

same here with rollup 1.7.4 and rollup-plugin-vue 4.7.2 after editing vue SFC

[Lee-Heisenbug]

@r4fx My projects are currently using rollup 0.65.0 and rollup-plugin-vue 4.2.0. Not sure if this could be a work around. Here are the devDependencies of one of my projects:

"devDependencies": {
"babel-core": "^6.26.3",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.7.0",
"dat.gui": "^0.7.3",
"node-sass": "^4.9.3",
"rollup": "^0.65.0",
"rollup-plugin-babel": "^3.0.7",
"rollup-plugin-clear": "^2.0.7",
"rollup-plugin-commonjs": "^9.2.0",
"rollup-plugin-copy-assets": "^1.0.0",
"rollup-plugin-cpy": "^1.1.0",
"rollup-plugin-ignore": "^1.0.5",
"rollup-plugin-livereload": "^0.6.0",
"rollup-plugin-node-resolve": "^3.3.0",
"rollup-plugin-replace": "^2.0.0",
"rollup-plugin-scss": "^0.4.0",
"rollup-plugin-serve": "^0.4.2",
"rollup-plugin-svgo": "^1.0.2",
"rollup-plugin-uglify": "^5.0.2",
"rollup-plugin-vue": "4.2.0",
"vue-template-compiler": "^2.5.17"
}

[jackprosser]

Any news on this? This has been open for a while now and it's a fairly major issue during development.

Quick fix for anyone looking to solve the issue

npm i [email protected]

[arantes555]

Just ran into this as well. Seems to be some interaction with rollup-plugin-replace

[sandrina-p]

rolling back to v4.2.0 solves the problem. However, we need the latest version that solves other previous bugs. Can you tell us (or do you know) when this issue will be a priority to fix?

[cawa-93]

Almost a year has passed since the issue was created. Milestone is version 4.7, but the latest version is 5.0.1. Everything looks like there will never be a solution 😔

[taoeffect]

Hi, I will donate $200 in BTC to whoever gets a perfect fix* to this problem merged into rollup/rollup-plugin-vue. Offer expires in 1 month (September 16th, 2019).

*as in: no hacks.

[darionco]

Not a "fix" but a plausible solution was committed in 3f879f3

It seems it has to do with how rollup's watch works and the source maps accumulating in the plugin. To bypass the issue, set needMap to false in your options:

config.plugins.push(vue({
    needMap: false,
}));

I am using TypeScript and haven't found issues with the source maps even after adding needMap: false, so there's that, YMMV though

[znck]

Similar to #248, tracking there.

[akauppi]

FYI: @darionco 's fix worked for me. rollup-plugin-vue 5.1.6

[hy-inger]

@darionco 's fix worked for me too. rollup-plugin-vue 5.1.6

[athrunsun]

@darionco Your solution works for me, but what does needMap: false do? I can't find it in the official documentation.

[darionco]

I dug through the code back when I posted this solution, I can't remember what it does anymore but it is safe to use and it does NOT disable source maps...

Maybe @znck remembers what it does? (he implemented it)

[znck]

needMap generates source maps for script block.

[athrunsun]

@znck So by setting needMap: false, I lost all source map support for <style> and <script> blocks in .vue files?

[znck]

Yep.

[AlttiRi]

"rollup-plugin-vue": "^5.1.9"

needMap: false will break source maps for components – the code in script block will be undebuggable (you can't set a break point).

But in additional it generates virtual js files, that contain only js code of component and it are debugable.

Without needMap: false I get the correct source map for components:

But in this case I can't use watcher for auto rebuilding, it will throw UnhandledPromiseRejectionWarning: Error: Multiple conflicting contents for sourcemap source.

import {watch} from "rollup";
import {inputOptions, outputOptions} from "./my-options.js";

const watchOptions = {
    ...inputOptions,
    watch: {
        skipWrite: true,
    }
};

const watcher = watch(watchOptions);
watcher.on("event", async event => {
    if (event.code === "BUNDLE_END") {
        const res = await event.result.generate(outputOptions); // Error (after I changed a watched file)
    }
});

[AlttiRi]

And it forces me to use the full Rollup rebuilding:

watcher.on("event", async event => {
    if (event.code === "START") {
        await build();
    }
});

What takes noticeable additional time.

[AlttiRi]

I think this issue should be reopen. https://github.com/vuejs/rollup-plugin-vue/issues/248 is about the related bug to this one, but it is not the same bug.

Currently it's impossible to use watcher _with this plugin_ if you use source map in the output options of Rollup:

const outputOptions = {
    sourcemap: true
};

Because you will get UnhandledPromiseRejectionWarning: Error: Multiple conflicting contents for sourcemap source on rebuilding after you have modified style or template block* of a component.

_(v5.1.9)_

*And for script block with v6.0.0 too.

[AlttiRi]

This poll request (not accepted) fixes this issue. But it applies only on 6.0.0. version of this plugin that works only with Vue 3.0.

Also I can note that "rollup-plugin-vue": "^6.0.0-beta.10" generates source map for virtual files even with needMap: true (with only debuggable template _(only for raw html, not pug)_):

Is it a bug? How to disable it?

[danielvy]

This bug should be reopened. It is still an issue with v6.0.0 and it is not the same bug as #248.

It prevents using watch mode when source maps are needed.