Support for the experimental syntax 'jsx' isn't currently enabled (.babelrc already added to root)

I am new to react and was trying to set up a new simple app, however when trying to start my app i get the following error:

Support for the experimental syntax 'jsx' isn't currently enabled.

Please note that I have already added .babelrc to my app folder; See it below:

//.babelrc

{
  "presets": ["@babel/preset-env", "@babel/preset-react"]
}
{
  "env": {
    "test": { "presets": ["react-app"] }
  }
}
{
  "plugins": ["react-html-attrs"]
}

I have also added babel.config.js but unsure whether this is actually doing anything:

//babel.config.js

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

Please beware that I am currently using a windows Pc; Any suggestion would be greatly appreciated.

My directory

//package.json//

{
  "name": "jamming",
  "version": "0.1.0",
  "private": true,
  "peerDependencies": {      
    "react": ">=15.0.1",
    "react-dom": ">=15.0.1"
},
 "devDependencies": {      
    "react": ">=15.0.1",      
    "react-dom": ">=15.0.1"  
}, 
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}