nuxt babel_Nuxt：添加Babel插件

nuxt babel

I recently wanted to use the nullish coalescing operator in the code of my Nuxt application. Of course, I needed to include the Babel plugin in order to support that, but for some reason I couldn’t find how to do that right away. Thus, I’m writing this brief guide to have it as a reference for myself and for anybody else that needs to do it in the future.

最近，我想在Nuxt应用程序的代码中使用无效的合并运算符 。 当然，我需要包括Babel插件以支持该功能，但是由于某种原因，我无法立即找到该方法。 因此，我正在编写此简要指南，以供我自己以及将来需要使用它的任何其他人参考。

The first thing to do is to install the babel plugin with npm to enable the usage of the nullish coalescing operator

首先要做的是使用npm安装babel插件，以启用无效合并运算符的使用

npm install --save-dev @babel/plugin-syntax-nullish-coalescing-operator

Once you have that, according to the guide Babel guide you need to add this on the configuration file:

一旦有了这些，根据Babel指南，您需要将其添加到配置文件中：

{  
  "plugins": ["@babel/plugin-syntax-nullish-coalescing-operator"] 
}

But surprise! Nuxt didn’t have a babel configuration file. However, after some research, I found out that we have to do this on the nuxt.config.js file, and it’s pretty straightforward. Just look for the build property, which is at the root level of the module.exports object, and add your plugin there:

但是惊喜！ Nuxt没有babel配置文件。 但是，经过一番研究，我发现我们必须在nuxt.config.js文件中执行此操作，这非常简单。 只需在module.exports对象的根目录下查找build属性，然后在其中添加插件即可：

module.exports = {  build: {    "plugins": ["@babel/plugin-syntax-nullish-coalescing-operator"]
  }
}

And that’s all. You can keep using the newest and greatest syntax of Javascript.

就这样。 您可以继续使用最新的Java语法。

翻译自: https://medium.com/swlh/nuxt-adding-babel-plugins-f288b1ad6304

nuxt babel