With `whitespace: 'condense'`, elements contain only   and spaces are condensed into empty tags

Version

4.0.0-rc.1

Reproduction link

https://github.com/tobyzerner/vue-cli-nbsp-bug

Environment info

Environment Info:
  System:
    OS: macOS 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
  Binaries:
    Node: 10.15.3 - /usr/local/bin/node
    Yarn: 1.17.3 - ~/.npm-global/bin/yarn
    npm: 6.11.3 - ~/.npm-global/bin/npm
  Browsers:
    Chrome: 76.0.3809.132
    Firefox: 68.0.2
    Safari: 12.1.2
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0
    @vue/babel-plugin-transform-vue-jsx:  1.0.0
    @vue/babel-preset-app:  4.0.0-rc.1
    @vue/babel-preset-jsx:  1.1.0
    @vue/babel-sugar-functional-vue:  1.0.0
    @vue/babel-sugar-inject-h:  1.0.0
    @vue/babel-sugar-v-model:  1.0.0
    @vue/babel-sugar-v-on:  1.1.0
    @vue/cli-overlay:  4.0.0-rc.1
    @vue/cli-plugin-babel: ^4.0.0-rc.1 => 4.0.0-rc.1
    @vue/cli-plugin-eslint: ^4.0.0-rc.1 => 4.0.0-rc.1
    @vue/cli-service: ^4.0.0-rc.1 => 4.0.0-rc.1
    @vue/cli-shared-utils:  4.0.0-rc.1
    @vue/component-compiler-utils:  3.0.0
    @vue/preload-webpack-plugin:  1.1.1
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^5.0.0 => 5.2.3
    vue: ^2.6.10 => 2.6.10
    vue-eslint-parser:  5.0.0
    vue-hot-reload-api:  2.3.3
    vue-loader:  15.7.1
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.10 => 2.6.10
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: 4.0.0-rc.1

Steps to reproduce

Clone the repo, npm install && npm run serve

What is expected?

The template contains a span containing a   character. This span has a red background. Thus you should see a small red box on the page.

What is actually happening?

The   in the template is being ignored and converted into a normal space, which means the span element is not displayed.

---

I cannot replicate this bug in a plain Vue jsfiddle, nor a project using vue-loader without vue-cli. Thus I think something in vue-cli may be the culprit rather than vue-template-compiler or Vue itself.

[sodatea]

I’ve transferred this issue to the vue repository because I believe it’s a bug introduced in https://github.com/vuejs/vue/commit/e1abedb9e66b21da8a7e93e175b9dabe334dfebd

See another bug report at https://github.com/vuejs/vue/issues/9208#issuecomment-477811927

Current workaround:

// vue.config.js
module.exports = {
  chainWebpack: config => {
    config.module
      .rule('vue')
        .use('vue-loader')
          .tap(args => {
            args.compilerOptions.whitespace = 'preserve'
          })
  }
}

[antoniandre]

I’ve transferred this issue to the vue repository because I believe it’s a bug introduced in e1abedb

See another bug report at #9208 (comment)

Current workaround:

// vue.config.js
module.exports = {
  chainWebpack: config => {
    config.module
      .rule('vue')
        .use('vue-loader')
          .tap(args => {
            args.compilerOptions.whitespace = 'preserve'
          })
  }
}

This doesn’t seem to work anymore with Vue 3, it throws the error: “TypeError: Cannot set property ‘whitespace’ of undefined”. Any workaround for Vue 3?