Please update document about jsx-pragma with esbuild.

[PeterlitsZo]

We are using vite, which use esbuild to deal with all source files(It will remove typescript keywords and so on to make it as a javascript but without typecheck). vite's document tell us how to enable esbuild's option --- But we have no idea that what need I do.

Here is documents we find:

• https://theme-ui.com/guides/jsx-pragma: your document about how to use jsx-pragma with babel/typescript, but not esbuild or vite.
• https://esbuild.github.io/api/#jsx-factory: esbuild's document about jsx-factory.
• https://vitejs.dev/guide/features.html#jsx: vite's config.(中文)

We'd like to help you and give you a PR. but... We do not know how to make it...

After some hours, we made it!!!!!! For vite!!!!

// vite.config.js
import { defineConfig } from 'vite';

export default defineConfig({
  esbuild: {
    jsxFactory: 'jsx',
    jsxInject: `import { jsx } from 'theme-ui'`,
  },
});

It will use jsx to build component. And add import { jsx } from 'theme-ui' for every file that using JSX!!!

We'd like to update the document and give you a PR. would you want it?

[hasparus]

We'd like to update the document and give you a PR. would you want it?

That would be a very nice addition to the docs. :)

[hasparus]

Here's the MDX file responsible for JSX pragma docs: https://github.com/system-ui/theme-ui/blob/develop/packages/docs/src/pages/guides/jsx-pragma.mdx

You should be able to edit it from GitHub UI even without cloning the repo :)

[PeterlitsZo]

Thanks. I give you a PR. Please check.