javascript - Nuxt : using `optional chaining operator` operator (.？)

Question

Nuxt 2.12.2 在尝试使用 object?.key 时在构建时抛出错误.

Module parse failed: Unexpected token (311:25)                                                                                                                                                 friendly-errors 10:36:40
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file

所以是因为 babel在 Nuxt 中配置为支持较旧的浏览器，例如 IE9我的项目中不需要的。

在另一个项目中，我只是把 .bablelrc

{
  "presets": [
    ["env", {
      "targets": {
        "browsers": ["last 2 Chrome versions"]
      }
    }]
  ]
}

但在 Nuxt .bablelrc被禁用。那我怎么做 optional chaining operator工作 ？

通过告诉 Nuxt 只支持现代浏览器。或添加 @babel/plugin-proposal-optional-chaining

Answer 1

如Nuxtjs Doc描述，.babelrc默认情况下被忽略。

我通过以下配置解决了这个问题。

// in nuxt.config.js
{
  // ...
  build: {
    // ....
    babel: {
      plugins: [
        '@babel/plugin-proposal-optional-chaining'
      ]
    }
  }
}

当然，在此之前，你应该安装 @babel/plugin-proposal-optional-chaining

npm i -D @babel/plugin-proposal-optional-chaining

我希望它对你有帮助。