Coming from C#, I really like the below code

var prop = item.prop?.propname


This is supported in JS if you use the below code


Babel plugin.

However, if you just create .babelrc file JSS does not use this. How do I make this work?


Someone named @aweber1 on slack #jss pointed me in the correct direction:

The JSS React sample app is based on create-react-app (CRA) https://github.com/facebook/create-react-app, which does not provide any "official" mechanisms for overriding or extending any of the configuration used by CRA. The formal recommendation from CRA is to "eject" your app, which allows you directly modify webpack and other configuration.

However, there are also community-built libraries that allow you to extend/modify the CRA config without ejecting. In particular: • https://github.com/timarney/react-app-rewiredhttps://github.com/harrysolovay/rescriptshttps://github.com/sharegate/craco

I was able to get craco to work, but it was a bit more involved.

  1. npm i @craco/craco -D
  2. npm i @babel/plugin-proposal-optional-chaining -D
  3. create .babelrc
  "plugins": [
  1. update the scripts section of package.json switch
  react-scripts start=> craco start
  react-scripts build => craco build
  react-scripts test=> craco test
  1. update /sitecore/definitions/config.js set: babelrc: true,
  2. update /server/server.webpack.config.js set: babelrc: true,

Check that jss start and jss deploy files both work.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.