jsx plugin error

[svnty]

Compiled with errors

Compiled with problems:

ERROR in ./node_modules/@react-native-material/core/lib/ActivityIndicator.js

Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /Users/admin/Documents/medicamina/node_modules/@react-native-material/core/lib/ActivityIndicator.js: Support for the experimental syntax 'jsx' isn't currently enabled (6:12):

  4 | const ActivityIndicator = ({ color = "primary", ...rest }) => {
  5 |     const { main } = usePaletteColor(color);
> 6 |     return <RNActivityIndicator {...rest} color={main}/>;
    |            ^
  7 | };
  8 | export default ActivityIndicator;
  9 |

Add @babel/preset-react (https://git.io/JfeDR) to the 'presets' section of your Babel config to enable transformation.
If you want to leave it as-is, add @babel/plugin-syntax-jsx (https://git.io/vb4yA) to the 'plugins' section to enable parsing.

I installed @babel/preset-react and created a .babelrc but it didn't solve the issue, I'm using react-app-rewired and have custom webpack configurations

I added customize-cra and used the addExternalPlugin function to add '@babel/plugins-syntax-js' and got this error

Compiled with problems:X

ERROR in ./node_modules/@react-native-material/core/lib/ActivityIndicator.js 13:9

Module parse failed: Unexpected token (13:9)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
 * ./node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
|     main
|   } = usePaletteColor(color);
>   return <RNActivityIndicator {...rest} color={main} />;
| };
| 

I added all five plugins from the @babel/preset-jsx to my plugins individually in config-overrides.js

const {
    override,
    addExternalBabelPlugins,
} = require('customize-cra');

module.exports = {
    webpack: override(
        ...addExternalBabelPlugins(
            '@babel/plugin-syntax-jsx', 
            '@babel/plugin-transform-react-jsx',
            '@babel/plugin-transform-react-display-name',
            '@babel/plugin-transform-react-jsx-self',
            '@babel/plugin-transform-react-jsx-source'
        ),
    )
};

Then I got this error

Compiled with problems:X

ERROR in ./node_modules/@react-native-material/core/lib/ActivityIndicator.js 4:0-72

Module not found: Error: Can't resolve 'react-native' in '/Users/admin/Documents/medicamina/node_modules/@react-native-material/core/lib'

seem to have fixed it with some installs here is my package.json

  "dependencies": {
    "@babel/plugin-syntax-jsx": "^7.16.7",
    "@babel/plugin-transform-react-display-name": "^7.16.7",
    "@babel/plugin-transform-react-jsx": "^7.17.3",
    "@babel/plugin-transform-react-jsx-self": "^7.16.7",
    "@babel/plugin-transform-react-jsx-source": "^7.16.7",
    "@react-native-material/core": "^1.3.5",
    "@testing-library/jest-dom": "^5.16.2",
    "@testing-library/react": "^12.1.3",
    "@testing-library/user-event": "^13.5.0",
    "@types/cors": "^2.8.12",
    "@types/jest": "^27.4.0",
    "@types/jsonwebtoken": "^8.5.8",
    "@types/node": "^17.0.18",
    "@types/react": "^17.0.39",
    "@types/react-dom": "^17.0.11",
    "add": "^2.0.6",
    "cors": "^2.8.5",
    "create-react-app": "^5.0.0",
    "customize-cra": "^1.0.0",
    "express": "^4.17.3",
    "express-graphql": "^0.12.0",
    "jsonwebtoken": "^8.5.1",
    "react-app-rewire-babel-loader": "^0.1.1",
    "react-app-rewired": "^2.1.12",
    "react-dom": "^17.0.2",
    "react-native": "^0.67.2",
    "react-native-web": "^0.17.6",
    "react-script": "^2.0.5",
    "sequelize": "^6.16.2",
    "typescript": "^4.5.5",
    "web-vitals": "^2.1.4"
  }

[yamankatby]

Hi @svnty, Thank you for reporting this issue.

But it is not clear whether you solved the problem or it still exists?

[svnty]

But it is not clear whether you solved the problem or it still exists?

The problem is fixed, I'm not exactly sure which item fixed it specifically, it might have been a number of contributions but my project is running now

[yamankatby]

But it is not clear whether you solved the problem or it still exists?

The problem is fixed, I'm not exactly sure which item fixed it specifically, it might have been a number of contributions but my project is running now

Glad to hear this, I will close this issue, for now, feel free to reopen if you get the error again.