webpack添加jsx

要在webpack中添加对JSX的支持，您需要进行以下配置：

1. 首先，安装所需的依赖项：

   npm install babel-loader @babel/preset-react --save-dev

2. 在webpack配置文件中，添加一个新的规则来处理JSX文件。找到 `module.rules` 数组，然后添加以下规则：

   module: {
     rules: [
       // ...其它规则...
       {
         test: /\.jsx?$/,
         exclude: /node_modules/,
         use: {
           loader: "babel-loader",
           options: {
             presets: ["@babel/preset-react"]
           }
         }
       }
     ]
   }

3. 确保您的项目根目录中存在`.babelrc`文件，并且其中包含以下内容：

   {
     "presets": ["@babel/preset-env"]
   }

4. 在您的webpack配置文件的顶部，添加以下代码来引入`path`模块：

   const path = require('path');

5. 确保您的webpack配置中有一个 `resolve` 对象，其中包含以下内容：

   resolve: {
     extensions: ['.js', '.jsx']
   }

完成上述步骤后，webpack将能够正确地处理JSX文件，并将其转换为浏览器可理解的JavaScript代码。