Now 100x Faster

Read the latest from Gatsby CTO Kyle Mathews Re-introducing Gatsby, a Reactive Site Generator

ContactSign Up for Free
Community Plugin
View plugin on GitHub

Gatsby plugin for babel optional chaining operator


This plugin enables the optional chaining operator (a?.b) TC39 proposal for Gatsby.

How to install

Install the plugin and its dependencies:

npm i gatsby-plugin-babel-optional-chaining @babel/core @babel/plugin-proposal-optional-chaining


yarn add gatsby-plugin-babel-optional-chaining @babel/core @babel/plugin-proposal-optional-chaining

Add the plugin to gatsby-config.js:

module.exports = {
  plugins: [
    // other plugins

Examples of usage

const obj = {
  foo: {
    bar: {
      baz: 42,

const baz = obj?.foo?.bar?.baz; // 42

const safe = obj?.qux?.baz; // undefined

// Optional chaining and normal chaining can be intermixed
obj?; // Only access `foo` if `obj` exists, and `baz` if
                   // `bar` exists

// Example usage with bracket notation:
obj?.['foo']?.bar?.baz // 42
© 2022 Gatsby, Inc.