How to use jsx in vuepress?

Question

Config

// ./docs/.vuepress/config.js
module.exports = {
  ...
  chainWebpack: (config, isServer) => {
    config.module
      .rule("js") // Find the rule.
      .use("babel-loader") // Find the loader
      .tap(options =>
        merge(options, {
          presets: [
            ["@babel/preset-env"],
            ["@vue/babel-preset-jsx", { injectH: false }]
          ],
          plugins: [
            [
              "import",
              {
                libraryName: "ant-design-vue",
                libraryDirectory: "es",
                style: "css"
              }
            ],
            "@babel/plugin-proposal-optional-chaining"
          ]
        })
      );
  }
}

The config didn't work, when I ran the code I met the following error.

Error

Uncaught Error: Module parse failed: Unexpected token (87:11)
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
|   },
|   render(h) {
    return <a-tree></a-tree>;
|   }
| };

Could someone give me the right config?