Getting "Multiple conflicting contents for sourcemap source" when trying to build app with rc.10

[Bodokh]

Environment

---

• Operating System: Darwin
• Node Version: v14.19.3
• Nuxt Version: 3.0.0-rc.10
• Nitro Version: 0.5.3
• Package Manager: [email protected]
• Builder: vite
• User Config: alias, app, env, server, build, css, modules, ignore, publicRuntimeConfig, runtimeConfig, vite, storybook
• Runtime Modules: @pinia/[email protected], @vueuse/[email protected], @nuxtjs/[email protected], ./modules/fonts/index.ts
• Build Modules: -

---

Reproduction

I am unable to reproduce this, I only hope you might know how this sort of error can arrise. The error happens in multiple versions of node, i checked versions: 14, 16, 18

EDIT:

I can confirm the issue does not happen on rc.9.

Describe the bug

I have a project that works when using yarn dev, but when i try to build i get the following error: Multiple conflicting contents for sourcemap source /somepath/pages/vue-page.vue

I tried deleting the page and building but it just threw the same error for another page and so on for all pages.

The build was working when I was using rc.6 beforehand.

Additional context

No response

Logs

ERROR  Multiple conflicting contents for sourcemap source /path/pages/user/profile.vue                                                                                                                 16:06:31


 ERROR  Multiple conflicting contents for sourcemap source /path/pages/user/profile.vue                                                                                                                 16:06:31

  at error (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:1858:30)
  at Link.traceMappings (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:13934:32)
  at collapseSourcemaps (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14027:63)
  at Chunk.render (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14896:19)
  at processTicksAndRejections (internal/process/task_queues.js:95:5)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16006:40
  at async Promise.all (index 109)
  at async Bundle.addFinalizedChunksToBundle (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16004:9)
  at async Bundle.generate (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:15984:13)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:23754:27

Another Log

  at error (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:1858:30)
  at Link.traceMappings (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:13934:32)
  at collapseSourcemaps (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14027:63)
  at Chunk.render (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14896:19)
  at processTicksAndRejections (node:internal/process/task_queues:96:5)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16006:40
  at async Promise.all (index 116)
  at async Bundle.addFinalizedChunksToBundle (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16004:9)
  at async Bundle.generate (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:15984:13)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:23754:27
  at async catchUnfinishedHookActions (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:23088:20)
  at async doBuild (node_modules/vite/dist/node/chunks/dep-557f29e6.js:45822:20)
  at async Module.build (node_modules/vite/dist/node/chunks/dep-557f29e6.js:45653:16)
  at async buildServer (node_modules/@nuxt/vite-builder/dist/shared/vite-builder.cbd4a916.mjs:589:5)
  at async bundle (node_modules/@nuxt/vite-builder/dist/shared/vite-builder.cbd4a916.mjs:825:3)
  at async build (node_modules/nuxt/dist/index.mjs:1992:5)
  at async Object.invoke (node_modules/nuxi/dist/chunks/build.mjs:46:5)
  at async _main (node_modules/nuxi/dist/cli.mjs:50:20)

[danielroe]

Would you provide a reproduction? 🙏

[ShaggyTech]

I had the same issue and solved it temporarily by adding this to my nuxt.config:

sourcemap: {
  server: false,
  client: false,
},

@danielroe This is not really a 'minimal' reproduction but maybe it will help:

Stackblitz Repo (branch: sourcemap-errors)

Running 'yarn build' will produce similar errors as to what @Bodokh described.

[daniluk4000]

I'm getting the same error with RC 11

[ShaggyTech]

So I did some more debugging with the reproduction I shared. In my particular case there is only one component causing this issue - CardGroup.vue .

1. If CardGroup component is not used then error goes away and build is successful, indicating this is the only component involved in the error.

2. Removing the <script>...</script> from CardGroup.vue will make the error go away and build is successful. I'm only using it to name the component in this instance.

3. Removing xl:(grid-cols-4 mt-20 px-8) windi class from CardGroup.vue#L7 makes the error go away and build is successful.

Doing either 2 or 3 independently will make the error go away.

To clarify the above:

• windi class and no

I put a breakpoint at Link.traceMappings (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:13934:32) which is where the error is thrown.

class Link {
 ...
   traceMappings() {
    ...
 **   else if (content != null && sourcesContent[sourceIndex] !== content) {
        return error({
            message: `Multiple conflicting contents for sourcemap source ${filename}`
        });
    }
   ...
}

I noticed there is a difference in content and sourcesContent[sourceIndex] variables which triggers the error. I'm combining my classes via windicss such as xl:(mt-10 pt-10). Variable sourcesContent[sourceIndex] has them separated like xl:mt-10 xl:pt-10 (maybe a part of the windi build process?), but this does not match content which retains original string like xl:(mt-10 pt-10).

What doesn't make sense is that I use these same windi class combinators in other components and they are fine. Also, why does removing the script and keeping the windi class build successfully?

This is about as far as I got and it's a weird one, but hopefully this provides some help in resolving the issue.

[danielroe]

It's definitely a weird one. Is anyone else with this issue using windicss or something similar?

[daniluk4000]

@danielroe I'm not using any. Here's dependencies list. I have no clue what's with that problem. Workaround with disabling source maps resolved the issue for me temporaly.

[toooni]

I do have the same issue with rc.11 and it seems like <client-only></client-only> is the problem.

[zavvla]

I have this problem too.

ERROR  Multiple conflicting contents for sourcemap source 
/Users/zavvla/Work/some/pages/questions/index.vue                                                      15:50:06

  at error (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:1858:30)
  at Link.traceMappings (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:13934:32)
  at collapseSourcemaps (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14027:63)
  at Chunk.render (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:14896:19)
  at processTicksAndRejections (node:internal/process/task_queues:96:5)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16006:40
  at async Promise.all (index 31)
  at async Bundle.addFinalizedChunksToBundle (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:16004:9)
  at async Bundle.generate (node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:15984:13)
  at async node_modules/vite/node_modules/rollup/dist/es/shared/rollup.js:23754:27

[toooni]

@zavvla Do you use <client-only/> blocks in there? If yes, can you try what happens if you remove it/them.

[zavvla]

@zavvla Do you use <client-only/> blocks in there? If yes, can you try what happens if you remove it/them.

yes, it fixed problem

[danielroe]

Would you check whether setting experimental.treeshakeClientOnly to false works around the issue for you?

[toooni]

I've added experimental: { treeshakeClientOnly: true }, to nuxt.config.js and the build still failed.

[ShaggyTech]

I did some more investigation tonight.

• Removed all <ClientOnly> from the app = still errors
• Tried setting experimental.treeshakeClientOnly to false = still errors

I found that this commit introduced the error: https://github.com/nuxt/framework/commit/eab4706614199594006b2132f57e838718ac3e73

The commit preceding that one does not error on build: https://github.com/nuxt/framework/commit/ec210190d13f904440ff25c7c4260252e9af892a

You can test by using the following nuxt versions:

• "nuxt": "npm:[email protected]" has no errors
• "nuxt": "npm:[email protected]" has sourcemap errors

This change to Vite maybe related?

[danielroe]

Thanks for the debugging @ShaggyTech. The reason that commit triggers it is that previously, vite.build.sourcemap was set to false by default, and that is probably the best workaround for now i you are experiencing this. (You can also set sourcemap to false, but that will also disable nitro sourcemaps, which you may wish to have.)

As for the cause, it seems like it might possibly be an upstream vite issue that is triggered by the interactions between vite plugins. It is triggered in the reproduction here, if I can tell correctly, by a sourcemap generated by components loader plugin not including the changes to classes, as you note above.

[yeonjulee1005]

The same symptom occurs in rc.12 version and the build and generate fails. T.T .. Please check problem.

[andysay]

also have it .rc13

if use client-only , and component have .client prefix will be brake , need use only .client prefix will be ok.

[TheAlexLichter]

also have it .rc13

if use client-only , and component have .client prefix will be brake , need use only .client prefix will be ok.

If you think that is a new problem, then please create a new issue ☺️