title: Module parse failed: Unexpected token when using webpack 5
body: <p>when I am using webpack 5 to compile my react project, shows this error:</p>
  <pre><code>[root@VM-0-16-centos cruise-web]# yarn build
  yarn run v1.22.10
  $ webpack --config config/dev.config.js
  [webpack-cli] Compilation finished
  assets by status 341 bytes [cached] 1 asset
  ./src/index.js 630 bytes [built] [code generated] [1 error]
  
  ERROR in ./src/index.js 10:2
  Module parse failed: Unexpected token (10:2)
  You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
  | 
  | ReactDOM.render(
  &gt;   &lt;React.StrictMode&gt;
  |     &lt;Provider store={store}&gt;
  |       {routes}
  
  webpack 5.6.0 compiled with 1 error in 126 ms
  error Command failed with exit code 1.
  info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
  </code></pre>
  <p>this is my <code>index.js</code>:</p>
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import './index.css';
  import { Provider } from 'react-redux';
  import reportWebVitals from './reportWebVitals';
  import routes from './routes/routes';
  import store from './store';
  
  ReactDOM.render(
    &lt;React.StrictMode&gt;
      &lt;Provider store={store}&gt;
        {routes}
      &lt;/Provider&gt;
    &lt;/React.StrictMode&gt;,
    document.getElementById('root')
  );
  
  // If you want to start measuring performance in your app, pass a function
  // to log results (for example: reportWebVitals(console.log))
  reportWebVitals();
  </code></pre>
  <p>this is my <code>package.json</code> config :</p>
  <pre><code>&quot;scripts&quot;: {
      &quot;start&quot;: &quot;react-scripts start&quot;,
      &quot;build&quot;: &quot;webpack --config config/dev.config.js&quot;,
      &quot;test&quot;: &quot;react-scripts test&quot;,
      &quot;eject&quot;: &quot;react-scripts eject&quot;
    }
  </code></pre>
  <p>and this is the <code>dev.config.js</code> config:</p>
  <pre><code>const path = require('path');
  
  module.exports = {
    module: {
      rules: [
      {
          test: /\.css$/i,
          use: [
          &quot;style-loader&quot;,
          &quot;css-loader&quot;,
          {
              loader: &quot;postcss-loader&quot;,
              options: {
              postcssOptions: {
                  plugins: [
                  [
                      &quot;postcss-preset-env&quot;,
                      {
                      // Options
                      },
                  ],
                  ],
              },
              },
          },
          ],
      },
      ],
    },
    entry: './src/index.js',
    output: {
      filename: 'main.js',
      path: path.resolve(__dirname, 'build'),
    },
  };
  </code></pre>
  <p>what should I do fix this problem?</p>