Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Optional chaining breaks build when targeting modern browsers

See original GitHub issue

🐛 Bug Report

Using the optional chaining operator causes the build to fail when targeting modern browsers through browserslist. See https://github.com/facebook/create-react-app/pull/8526 for the same issue we ran into in CRA.

Have you read the Contributing Guidelines on issues?

Yes.

To Reproduce

Set "browserslist": ["last 1 chrome version"] in package.json of generated project (may need to delete node_modules/.cache if it exists)
Create a React component that is used in a .mdx document
Use optional chaining operator within the React component
Use start or build script and observe error similar to following:

Expected behavior

Build succeeds.

Actual Behavior

Module parse failed: Unexpected token (12:111)
File was processed with these loaders:
 * ./node_modules/cache-loader/dist/cjs.js
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| useEffect(()=>{if(!messagingJson){return;}// Decode entities in the URL
> const hash=window.decodeURIComponent(window.location.hash);if(hash){document.getElementById(hash.substring(1))?.scrollIntoView();}},[messagingJson]);return messagingJson?/*#__PURE__*/React.createElement(MessagingContent,{schema:messagingJson,type:type}):/*#__PURE__*/React.createElement("div",null,"Loading...");}
 @ ./src/components/ViewerMessaging/index.ts 1:0-39 1:0-39
 @ ./docs/mobile/api-commands-operations-events.mdx
 @ ./.docusaurus/registry.js
 @ ./node_modules/@docusaurus/core/lib/client/exports/ComponentCreator.js
 @ ./.docusaurus/routes.js
 @ ./node_modules/@docusaurus/core/lib/client/clientEntry.js
 @ multi ./node_modules/react-dev-utils/webpackHotDevClient.js ./node_modules/@docusaurus/core/lib/client/clientEntry.js

Your Environment

Docusaurus version used: 2.0.0-alpha.56
Environment name and version (e.g. Chrome 78.0.3904.108, Node.js 10.17.0): Chrome 83
Operating system and version (desktop or mobile): Ubuntu 20.04