why is my babel config ignoring this plugin?

Question

this my babe.config.js :

module.exports = {
  presets: [
    '@babel/preset-react',
    [
      '@babel/preset-env',
      {
        modules: false,
      },
    ],
  ],
  plugins: [
    '@babel/plugin-proposal-optional-chaining',
    'styled-components',
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-syntax-dynamic-import',
  ],
  env: {
    production: {
      only: ['app'],
      plugins: [
        'lodash',
        'transform-react-remove-prop-types',
        '@babel/plugin-transform-react-constant-elements',
      ],
    },
    test: {
      plugins: [
        '@babel/plugin-transform-modules-commonjs',
        'dynamic-import-node',
      ],
    },
  },
};

right now I'm getting this error :

Support for the experimental syntax 'optionalChaining' isn't currently enabled (39:37):

  37 | 
  38 | try {
> 39 |   console.log('APP VERSION', process?.env?.VERSION, process?.env?.ENVIRONMENT);
     |                                     ^
  40 | } catch (e) {
  41 |   console.error(e);
  42 | }

Add @babel/plugin-proposal-optional-chaining (https://git.io/vb4Sk) to the 'plugins' section of your Babel config to enable transformation.

so basically babel is ignoring @babel/plugin-proposal-optional-chaining the very plugin that is supposed to take care of optionalChaining

Answer 1

I solved this issue by simply upgrading @babel/core to the latest version .