Are you running this inside of a node_modules folder? If so you need to change

exclude: [/node_modules/],

so it doesn't exclude your project.

It should become something along the lines of

exclude: [/node_modules/ &&
        !/node_modules\/(project_name)/],

But with correct regex syntax and change project_name to the folder name.

I must have tried tons of different ways. Sharing what worked for me. Do take note of the versions, different versions might need tweaks.

My react project was created using create-react-app (CRA). Now since CRA hides babel and webpack config files and there is no way to modify them, there are basically 2 options:

• react eject (which I didn't try. Felt managing all by myself could get bit overwhelming).
• Use react-app-rewired to tweak babel configs without having to eject. (I used this)

I additionally used customize-cra. React-app-rewired suggests it for later versions of CRA.

Update scripts and add dev dependencies in package.json:

 "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject",
    "docs": "jsdoc -c jsdoc.conf.json"
  },
"devDependencies": {
    "@babel/plugin-proposal-class-properties": "^7.10.1",
    "customize-cra": "^1.0.0",
    "react-app-rewired": "^2.1.6",
    "@babel/preset-react": "^7.10.1"
  }

config-overrides.js (must be at root level, i.e. at same directory level of package.json).

If error is from some library in node_modules, make sure to 'include' it (babelInclude):

const path = require('path');
const {
    override,
    babelInclude,
    addBabelPreset,
    addExternalBabelPlugin,
} = require('customize-cra');

module.exports = override(
    babelInclude([
        path.resolve('src'),
        path.resolve('node_modules/react-native-animatable'),
    ]),
    addBabelPreset("@babel/preset-react"),
    addExternalBabelPlugin('@babel/plugin-proposal-class-properties'),
);

Creating a babel.config.js with this script solve my issue

module.exports = {
    presets:[
        "@babel/preset-env",
        "@babel/preset-react"
    ]
}

This is difficult for us backend engineers just starting out with React, iterating on the community's 3 or 4 years' worth of hackish workarounds to fundamental problems with create-react-app. After a whole week of dead-end encounters with deprecated packages and advice, I learned it turns out you don't need react-app-rewired at all.

Here's my answer (hopefully helps others who follow the same google rabbit-hole): define these in your package.json:

  "main": "./build/index.js",
  "module": "./build/index.js",
  "devDependencies": {
    "@babel/cli": "^7.14.3",
    "@babel/core": "^7.14.3",
    "@babel/preset-env": "^7.14.4",
    "@babel/preset-react": "^7.13.13",
    "commander": "^7.2.0",
    ...
  },
  "scripts": {
    ...
    "transpile": "NODE_ENV=production npx babel --out-dir ../build --relative --copy-files src",
  },
  "babel": {
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react"
    ]
  },

The npm transpile ; npm publish commands should now work. I found that due to the issue described here by Utku Gultopu, users of yarn will need to do this beforehand to fully upgrade from babel 6 to 7:

npm install @babel/core @babel/cli @babel/preset-react @babel/preset-env

You don't need any of these: webpack.config.js, .babelrc or babel.config.js. Be sure to clear the build subdirectory (and include it in .gitignore) before running either the build (for creating a runtime image) or transpile (for publishing your module library) operations--they are two very different things.