Support jsx-transform for React extensions

[vividviolet]

React 17 has support for jsx without React: https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html

Our ESBuilder needs to also add this support as it doesn't come for free. More info in this issue: evanw/esbuild#334

[t6d]

Is this required for the initial release or just a nice to have?

[vividviolet]

I think we need to have this since the current build tool support it. I'll look into whether this is feasible. If it's not we'd need to add a disclaimer into our release notes that React is required for jsx even if you're not using any specific React methods or hooks

[marvinhagemeister]

FYI: esbuild added support for the jsx-runtime transform recently: evanw/esbuild#334

[jamesvidler]

Is this still required for GA?

[jamesvidler]

@vividviolet is this still something we think is important for GA?

[vividviolet]

I think so - it used to work with the old build tools so we'd just be putting back something that's missing

[jamesvidler]

@vividviolet are you able to share some context you have on how we might go ahead and implement this?

[cpeddecord]

looks like the ESBuild options are created here:

https://github.com/Shopify/cli/blob/64f8e05158f75c78aa8567f2899072138f8c0154/packages/app/src/cli/services/extensions/bundle.ts#L71

[jamesvidler]

Closing this issue - was resolved in Shopify/cli#577.

[jamesvidler]

Re-opening this because we only implemented this the Node CLI, not the Go CLI. The Node CLI isn't used publicly yet.

Jsx implementation in Node
Follow-up PR to add-back the React import when using Go

To close this issue:
We should remove the import React from 'react'; from the checkout ui extension template BUT only if:

1. Wait until Node CLI flow is being used publicly and Go CLI is not longer used
2. OR implement the jsx-transform in the GO CLI