Subscribe on changes!

Vue3 always renders HTML comments in dev mode [Vue2 Breaking Change]

avatar
Jun 24th 2021

Version

3.1.2

Reproduction link

https://github.com/DV8FromTheWorld/vue-repro__vue3-comment-stripping

Steps to reproduce

  1. write any amount of code in Vue2 that includes comments
  2. In dev, they are stripped out of no comments option is provided to new Vue({ ... }) or if it is explicitly false. Same applies to prod.
  3. Convert that code to Vue3 (by way of the @vue/compat build if desired)
  4. Note that the comments option has no effect on the rendering of HTML comments in dev. It does effect prod.
  5. Note that if the code depended on the lack of additional VNodes created by comments (like for slots) that it will now fail due to them being present.

What is expected?

Vue should drop comments when compilerOptions.comments = false (default). This was the behavior of Vue2.

What is actually happening?

Vue only drops HTML comments in production mode. There is no user control over this functionality in development


In Vue2, the developer had control over whether to retain comments in development and production modes. As of Vue3 this functionality has been changed such that the developer only has control when in production and comments are maintained in development.

This difference is visible here:

For our codebase this is a breaking change as there are plugins that expect to only receive a single root node. We have HTML comments spread liberally throughout our codebase so this is problematic that we cannot strip the comments from the build HTML anymore when working locally.

Leaving control over whether to maintain comments or not in a specific environment should remain a developer decision, not a library enforced one.

Or, at a minimum, can we have the option be respected in development mode but it be defaulted to true? This would maintain the current Vue3 functionality while enabling Vue2 code to be migrated gracefully.

At a minimum this should be mentioned in some form or fashion in the Migration docs / be supported by @vue/compat.