javascript - Gatsby Config 在 Javascript 文件中给出错误 ??运算符(operator)

Question

我正在尝试运行一个 Gatsby 站点，但是当我执行 npm run develop 时，出现了这个错误:

> gatsby develop

 ERROR #10123  CONFIG

We encountered an error while trying to load your site's gatsby-config. Please fix the error x try again.



  Error: D:\Coding\web-blog\src\infra\feed.js:28
  description: post.intro ?? post.description,
                           ^

代码:

const item = {
                title: sanitizeTitle(post.title),
                description: post.intro ?? post.description,
                url: `${site.siteMetadata.siteUrl}/${post.slug}`,
                guid: `${site.siteMetadata.siteUrl}/${post.slug}`,
                categories: post.tags,
                author: site.siteMetadata.author,
                date: post.date,
            }

Javscript 中的 ?? 运算符是什么？它是一种新的语言功能吗？

Answer 1

nullish 合并运算符 (??) 它是 ECMAScript 2020 ( see TC39 proposal ) 的一项功能。可以通过modifying the babel configuration添加或者通过安装 gatsby-plugin-nullish-coalescing-operator插件。

如果您选择第一个版本，请在项目的根目录中添加一个 .babelrc 并使用以下内容填充它:

{
  "plugins": [
    ["@babel/plugin-proposal-nullish-coalescing-operator"]
  ],
  "presets": [
    [
      "babel-preset-gatsby",
      {
        "targets": {
          "browsers": [">0.25%", "not dead"]
        }
      }
    ]
  ]
}

注意:您需要安装 @babel/plugin-proposal-nullish-coalescing-operator依赖。

What is this operator in Javascript?

nullish 合并运算符 (??)，如果 left 为 null 或 undefined，则使用正确的值。 OR 运算符 (||) 之间的主要区别在于在 ""、0 中使用时可能导致一些错误的虚假值> 或 false 值(还有更多假值，例如 -0、NaN 等，但这些都是常见的)。所以:

description: post.intro ?? post.description,

只要 post.intro 存在，您就会使用它，否则(如果 post.intro 为 null 或 undefined)，您将使用 post.description。