Is it possible to update a plugin's version of React?

UXP Developer Tool
,
1

Using InDesign v20 and UDT v2.0.2 I’ve finally managed to get a UXP plugin for InDesign working so i can begin converting my ExtendScripts thanks to various resources around the net, but i noticed right away it was using React and React/DOM v16.8.6, where as the most recent non-RC version is around 18.5.

While this doesn’t completely prevent me from working in it, its not using the standard react project structure I’m use to. For instance using an index.jsx and panelController instead of an index.js or main.js and App.jsx component. In addition ‘require’ is still used as the primary importing rather than the standardized ‘import from’ syntax.

In browsing around Adobe github pages i found one for the SWC-React example that shows them using React 18.2 and all the familiar structure i’m used to, however I couldn’t get that starter to work.

Trying to transfer over some of the structure from that project and updating my react versions did not work and constantly hit problems with various archaic syntax used in the template project (modules, require, createRoot not working, the location of the manifest.json not being in a plugin folder, ect.)

So, is it possible to upgrade a plugin projects react version and convert everything over to the modern standards? if so does anyone know of a guide or resource they can point me to?

2

As far I know React 18 doesn’t need special treatment. But SWC React example is special. Components here work very differently and needs special treatment.

3

yea i guess i was over complicating it. i installed react and react-dom @latest, then i only had to convert the

ReactDOM.render(this[_Component]({ panel: this }), this[_root])

to

const root = createRoot(this[_root])
root.render(this[_Component]({ panel: this }))

Due to my lack of deep understanding of react, my question now would be how would i go about replacing the index.jsx from the template to a more traditional index.js and App.jsx, or is that not advised?