React Native Web support without Next.js

[midzdotdev]

Description of the feature

👋 Hi Cedric, and thank you for putting together this example - it's a real help to know how to configure all these tools together.

I'm curious whether you've been able to get web support without using Next. As far as I can tell, this hasn't yet been implemented within this repo. After pnpm install and pnpm build, I'll run pnpm --filter @acme/mobile-app web it prompts me to add the base webpack config.

It looks like you're trying to use web support but don't have the required dependencies installed.

Please install @expo/webpack-config@^0.17.2 by running:

npx expo install @expo/webpack-config@^0.17.2

If you're not using web, please ensure you remove the "web" string from the platforms array in the project Expo config

After adding the above, running pnpm --filter @acme/app-mobile run web seems happy from the CLI, but when viewing in the browser I get a blank screen. It shows me errors in the console, which when looking at the bundle source seems to indicate a webpack misconfiguration.

Honestly, I wouldn't know where to start amending the Webpack configuration for expo. I would happily pay you for your help getting this configuration to work if that's any consolation.

This is something I really want to get working, although perhaps I'm seeing it from the wrong angle. I'm aware that Next.js has it's perks, but I'm curious for the reason in this monorepo why Next is used rather than Expo's built-in web bundle tooling? It would be great if it demonstrated both cases.

Motivation

This removes the need to maintain two separate packages, separated by pure-web and native bundles.

[byCedric]

Hey @midzdotdev! Thanks, I'm happy to keep this example working for everyone as an example of "how you could configure" things :)

As for the choice of Next over Expo Web (with webpack), it's simply because Next is more used than Expo Web (with webpack).

Currently, it seems that we might be transitioning away from Webpack. It has a lot of issues that are really hard to solve. One thing you could try though is using Metro web instead :) It's still in development, and might not be 100% perfect, but Expo Router is currently pushing that really hard.

To try Expo Web (metro), you need to set expo.web.bundler = "metro" in your app.json configuration. This enables the same stuff that we use for Expo Router.

Hope this helps!