react-native-test-app icon indicating copy to clipboard operation
react-native-test-app copied to clipboard

Published 20 hours ago • verified publisher icon microsoft

react-native-web support

Open zoontek opened this issue 2 years ago • 1 comments

Proposal

Hi 👋

I'm currently targetting the web for some react-native libraries (ex: react-native-localize). It could be nice to add support for react-native-web, as it's well used.

Alternatives

Using react-native-test-app + keeping a package.json with a bundler (vite? webpack?)

Implementation Details

  • Add vite to the project
// vite.config.js

/** @type {import("vite").UserConfig} */
const config = {
  resolve: {
    alias: {
      "react-native": "react-native-web",
    },
    extensions: [
      "web.mjs",
      "mjs",
      "web.js",
      "js",
      "web.ts",
      "ts",
      "web.jsx",
      "jsx",
      "web.tsx",
      "tsx",
      "json",
    ],
  },
};

export default config;

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>react-native-test-app</title>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="../../example/index.web.js"></script>
  </body>
</html>

Additional Context

No response

Code of Conduct

  • [X] I agree to follow this project's Code of Conduct

zoontek avatar Mar 17 '22 16:03 zoontek

I've had a few people ask me about this in the past and my answer has always been "sure, why not". But reality is that I am not familiar with react-native-web, and we don't have any teams using this internally (that I am aware of). That doesn't mean that I can't add support for it, my concern is whether it'll be a good experience for everyone.

If this is something that you have strong opinions about, would you be up for contributing web support?

tido64 avatar Mar 17 '22 17:03 tido64