expo next monorepo example

Euen Dieses Repo ist zum Solito -Starter gewechselt

Sie können jetzt stattdessen Solito verwenden:

npx create-solito-app@latest

---

Expo + Next.js Monorepo Beispiel

Dieses Repo ist zugunsten von Solito veraltet Euen

Hier ist ein Beispiel, das zeigt, wie eine universelle React -App mit Expo und Next.js in einem Monorepo erstellt wird.

Sie werden inklusive finden:

• Expo SDK 43 (mit Hermes auf iOS und Android)
• Weiter.js 12
• Reagieren Sie nativ für Web
• Typoskript
• Babel -Konfiguration, die für Expo und Next.js mit neu beanstanden in einem Monorepo funktioniert
• Wiederbelebt
• Reagieren Sie ein natives Bodenblatt
• Tropf

Und Ready-to-Use (kleine Konfiguration erforderlich):

• Expo -Anwendungsdienste
• Kunden für benutzerdefinierte Entwicklung
• Posten

Architektur

App

Code zwischen iOS, Android und Web geteilt

cd packages/app

Expo

Einheimisch

Expo -Eintragspunkt: packages/expo/App.tsx

cd packages/expo

yarn start:expo , um die iOS- und Android -App mit Expo zu starten

Demo: https://expo.dev/@poolpoolpool/example?release-channel=Production

Pro -Tipp: Erstellen und starten Sie einen Kunden für benutzerdefinierte Entwicklungen mit SCHEME=com.example.axel yarn run:ios -d (Ersetzen Sie axel durch Ihren Vornamen)

Weiter.js

Netz

NEXT.JS EINTRAGPOINT: packages/next/src/pages/_app.tsx

cd packages/next

yarn dev , um die Web -App zu starten

Demo: https://expo-next-monorepo-example.vercel.app

Notizen

Wurzel

• Fügen Sie hier kein Paket hinzu

App

• Fügen Sie hier kein Paket hinzu

Expo

• Fügen Sie alle Ihre reagierenden nativen und universellen Pakete hier hinzu
• Veröffentlichen Sie zur Expo mit yarn publish:production

Weiter.js

• Fügen Sie hier Ihre Nur-Web-Pakete hinzu
• Bereitstellen Sie mit yarn deploy packages/next Vercel ein. Wenn es fehlschlägt, konfigurieren Sie Ihr Projekt korrekt: Gehen Sie zu Ihren Projekteinstellungen auf Vercel und setzen

Navigation

Hier ist ein Beispiel für die Umgang mit Navigation: #1

Was soll ich als nächstes tun?

Hier sind einige Ideen, um Ihnen den Einstieg zu erleichtern:

• Verwenden Sie React Navigation
• Stylen Sie Ihre App mit Drippsy
• Animieren Sie Ihre App mit Moti
• Machen Sie einige Anfragen mit dem SWR- oder Apollo -Client
• Bauen Sie coole Dinge mit Expo -Modulen auf
• Erstellen Sie einen Kunden für benutzerdefinierte Entwicklung
• Sentry hinzufügen
• Fügen Sie CI/CD mit EAS über Github -Aktionen hinzu
• ...

Verwandte Monorepo -Beispiel

Ich empfehle auch, dieses Beispiel von Cedric zu lesen: https://github.com/bycedric/eas-monorepo-example. Es enthält einige EAS -Github -Aktionen und ein bloßes Workflow (ausgestoßen).

Lizenz

MIT