Vue: 在`whitespace:'condense'`中,元素仅包含,空格被压缩为空标签

创建于 2019-09-06  ·  6评论  ·  资料来源: vuejs/vue

4.0.0-rc.1

复制链接

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

环境信息

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

重现步骤

克隆仓库, npm install && npm run serve

期望什么?

模板包含一个包含 字符的跨度。 此范围具有红色背景。 因此,您应该在页面上看到一个红色的小方框。

实际发生了什么?

模板中的 被忽略并转换为普通空间,这意味着不会显示span元素。


我无法在普通的Vue jsfiddle中复制此错误,也无法在没有vue-cli的情况下使用vue-loader复制项目。 因此,我认为vue-cli中的某些东西可能是罪魁祸首,而不是vue-template-compiler或Vue本身。

bug compiler has PR

最有用的评论

我已将此问题转移到vue存储库中,因为我相信这是https://github.com/vuejs/vue/commit/e1abedb9e66b21da8a7e93e175b9dabe334dfebd中引入的错误

https://github.com/vuejs/vue/issues/9208#issuecomment -477811927中查看另一个错误报告

当前解决方法:

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

所有6条评论

我已将此问题转移到vue存储库中,因为我相信这是https://github.com/vuejs/vue/commit/e1abedb9e66b21da8a7e93e175b9dabe334dfebd中引入的错误

https://github.com/vuejs/vue/issues/9208#issuecomment -477811927中查看另一个错误报告

当前解决方法:

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

是否也可以忽略空格(   )..?

_edit:对不起,没有看到问题链接_

@naton如前所述,这应该在vue

@LinusBorg这不是Vue回购吗? 链接的问题是添加“压缩”的原始更改,不是吗? 它也关闭了。

我们今天才遇到这个问题,并试图找出解决方法。 我们已经内置了一些本地化自动化功能,它们假定为“压缩”设置(基于埃文(Evan)的建议,在3.x中它将是默认设置,因为我同意压缩行为。 因此,很难将其交换回去保存而没有潜在的副作用。

好吧,似乎根本就不包括nbsp; 内部的元素本身可以解决问题。 将其添加为遇到此问题的其他人的注释。

我已经将此问题转移到vue存储库中,因为我相信这是e1abedb中引入的错误

#9208上查看另一个错误报告

当前解决方法:

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

这似乎在Vue 3上不再起作用,它引发错误:“ TypeError:无法设置未定义的属性'whitespace'。 Vue 3有任何解决方法吗?

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

fergaldoyle picture fergaldoyle  ·  3评论

Jokcy picture Jokcy  ·  3评论

julianxhokaxhiu picture julianxhokaxhiu  ·  3评论

lmnsg picture lmnsg  ·  3评论

robertleeplummerjr picture robertleeplummerjr  ·  3评论