title: React build issus :You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file
body: <p>I'm setting up webpack to my react project using <code>npm run dev</code> and this error appears: </p>
  
  <p>ERROR in ./MesWeb/frontend/src/index.js 8:2
  Module parse failed: Unexpected token (8:2)
  You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See <a href="https://webpack.js.org/concepts#loaders" rel="nofollow noreferrer">https://webpack.js.org/concepts#loaders</a></p>
  
  <pre><code>| const rootElement = document.getElementById("root");
  | ReactDOM.render(
  &gt;   &lt;BrowserRouter&gt;
  |     &lt;Switch&gt;
  |       &lt;App /&gt;
  </code></pre>
  
  <p>webpack.config.js</p>
  
  <pre><code>var path = require('path')
  var webpack = require('webpack')
  
  module.exports = { 
      entry: ["./MesWeb/frontend/src/App.js","./MesWeb/frontend/src/index.js"],
      output: {
        path: path.resolve(__dirname, 'frontend'),
        filename: 'main.js'
      },
      module:{
          rules:[{
              test: /\.js$|jsx/,
              exclude : /node_modules/,
              loader:"babel-loader" 
          }]
      },
      module: {
        rules: [{
          test: /\.css$/,
          loaders: ['style', 'css']
        }]
      }
  }
  </code></pre>
  
  <p>.babelrc</p>
  
  <pre><code>{
      "presets": ["@babel/preset-env" ,"@babel/preset-react", "env", "react"],
      "plugins" :["transform-class-properties"]
  }
  </code></pre>
  
  <p>package.json</p>
  
  <pre><code>{
    "name": "WEB",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "dev": "webpack --mode development ./MesWeb/frontend/src/index.js --output ./MesWeb/frontend/static/frontend/main.js",
      "build": "webpack --mode production ./MesWeb/frontend/src/index.js --output ./MesWeb/frontend/static/frontend/main.js"
    },
    "repository": {
      "type": "git",
      "url": "http://60.249.209.133:3000/MCS/WEB.git"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "devDependencies": {
      "@babel/cli": "^7.10.1",
      "@babel/core": "^7.10.1",
      "@babel/preset-env": "^7.10.1",
      "@babel/preset-react": "^7.10.1",
      "babel-core": "^6.26.3",
      "babel-loader": "^8.1.0",
      "babel-plugin-lodash": "^3.3.4",
      "babel-plugin-react-transform": "^3.0.0",
      "babel-plugin-transform-class-properties": "^6.24.1",
      "babel-preset-env": "^1.7.0",
      "babel-preset-react": "^6.24.1",
      "css-loader": "^3.5.3",
      "prop-types": "^15.7.2",
      "react-dom": "^16.13.1",
      "style-loader": "^1.2.1",
      "webpack": "^4.43.0",
      "webpack-cli": "^3.3.11",
      "webpack-dev-server": "^3.11.0"
    },
    "dependencies": {
      "@chakra-ui/core": "^0.8.0",
      "@emotion/core": "^10.0.28",
      "@emotion/styled": "^10.0.27",
      "babel-polyfill": "^6.26.0",
      "bootstrap-4": "^4.0.0",
      "emotion-theming": "^10.0.27",
      "react": "^16.13.1",
      "react-bootstrap": "^1.0.1",
      "react-router-bootstrap": "^0.25.0",
      "react-router-dom": "^5.2.0",
      "react-script": "^2.0.5"
    }
  }
  </code></pre>