How to re-configure TypeScript in a react-native project to support react-native-web

Problem

I am working on this PR where I add Webpack in my project.

My goals are

• long term: to configure Webpack in the react-native project in order to distribute a web application using react-native-web.
• short term: to render a simple <div>hello world</div> without any linting or typing errors.

This is the typescript configuration diff. I did change lib to "lib": ["dom", "dom.iterable", "esnext"],.

Since I have a lot of TypeScript errors in my src directories, such as :

/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/src/App.tsxTypeScript error in /home/dka/workspace/github.com/pass-culture/pass-culture-app-native/src/App.tsx(94,7):Type 'JSX.Element' is not assignable to type 'Element'.  TS2322    92 |   return (    93 |     <ABTestingProvider>> 94 |       <SafeAreaProvider>       |       ^    95 |         <ThemeProvider theme={theme}>    96 |           <QueryClientProvider client={queryClient}>    97 |             <AuthWrapper>

How can I re-configure TypeScript to support Webpack (Web) without breaking the workspace initial typing validation?

Reproduction

git clone https://github.com/pass-culture/pass-culture-app-native.gitcd pass-culture-app-nativegit checkout webpackyarnyarn start:web