Error: Support for the experimental syntax 'jsx' isn't currently enabled

[PaulaSalinoRibeiro]

I tried updated react-page-loading library to react-page-loading-v2 and find a error follow:

SyntaxError: /Users/paularibeiro/easyLive/frontend/node_modules/react-page-loading-v2/src/index.js: Support for the experimental syntax 'jsx' isn't currently enabled (21:7):

  19 |   if (loading) {
  20 |     return (
> 21 |       <div style={containerStyle}>
     |       ^
  22 |         <ReactLoading {...props} />
  23 |       </div>
  24 |     );

Add @babel/plugin-transform-react-jsx (https://git.io/vb4yd) to the 'plugins' section of your Babel config to enable transformation.

My babel.config.json file

{
    "plugins": ["babel-plugin-styled-components", "@babel/plugin-transform-react-jsx", "@babel/plugin-transform-modules-systemjs", "@babel/plugin-syntax-typescript"],
    "presets": ["@babel/plugin-transform-react-jsx", "@babel/preset-react"]
}

And package.json

 "dependencies": {
    "@babel/plugin-syntax-typescript": "^7.20.0",
    "@babel/plugin-transform-modules-systemjs": "^7.20.11",
    "@babel/preset-react": "^7.18.6",
    "@loadable/component": "^5.15.2",
    "@material-ui/core": "^4.10.0",
    "@material-ui/icons": "^4.9.1",
    "@material-ui/lab": "^4.0.0-alpha.56",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "axios": "^0.19.2",
    "bootstrap": "^4.5.0",
    "lodash": "^4.17.21",
    "moment": "^2.27.0",
    "node-sass": "^4.14.1",
    "react": "^16.13.1",
    "react-app-polyfill": "^1.0.6",
    "react-bootstrap": "^1.0.1",
    "react-cookie": "^4.1.1",
    "react-cookie-consent": "^6.4.1",
    "react-copy-to-clipboard": "^5.0.2",
    "react-device-detect": "^1.13.1",
    "react-dom": "^16.13.1",
    "react-facebook-login": "^4.1.1",
    "react-google-login": "^5.1.21",
    "react-google-recaptcha": "^2.1.0",
    "react-hook-form": "^6.0.1",
    "react-html-parser": "^2.0.2",
    "react-input-mask": "^2.0.4",
    "react-lazyload": "^3.2.0",
    "react-multi-carousel": "^2.5.5",
    "react-page-loading-v2": "^1.0.16",
    "react-paginate": "^6.3.2",
    "react-redux": "^7.2.0",
    "react-responsive-carousel": "^3.2.9",
    "react-router-dom": "^5.2.0",
    "react-scripts": "3.4.1",
    "react-share": "^4.3.1",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "reselect": "^4.0.0",
    "source-map-explorer": "^2.5.2",
    "styled-components": "^5.2.3"
  },
  "devDependencies": {
    "@babel/plugin-transform-react-jsx": "^7.20.7",
    "@commitlint/cli": "^9.1.2",
    "@commitlint/config-conventional": "^9.1.2",
    "commitizen": "^4.2.1",
    "cz-conventional-changelog": "3.3.0",
    "husky": "^4.2.5"
  },

Someone have any ideia what I can do to solve this?