https://github.com/gasolin/pear-expo

basic setup for react native web (expo) run in pear desktop
https://github.com/gasolin/pear-expo

Last synced: 1 day ago
JSON representation

basic setup for react native web (expo) run in pear desktop

• Host: GitHub
• URL: https://github.com/gasolin/pear-expo
• Owner: gasolin
• Created: 2024-03-06T09:31:08.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-09-17T15:35:44.000Z (2 months ago)
• Last Synced: 2024-09-18T07:09:47.883Z (2 months ago)
• Language: JavaScript
• Size: 87.9 KB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-pears - pear-expo - React Native web (Expo) setup for pear desktop (**Awesome Pears 🍐** / Pears)
• awesome-pears - pear-expo - React Native web (Expo) setup for pear desktop (**Awesome Pears 🍐** / Pears)

README

        
# Pear-Expo

React Native web (Expo) setup for pear desktop

> Note in current stage its not include hypercore support and no android/ios integration.

## structure

- app/ - [expo](https://docs.expo.dev/) folder, host the main code and can export web UI as `dist/` folder for pear use

- pear/ - [pear](https://docs.pears.com/guides/starting-a-pear-desktop-project) folder

## Setup

1. `cd app && yarn` (or `cd app && npm install`)

## Run on Android or iOS App 📱

1. cd app && npx expo start

1. press `a` (Android) or `i` (iOS)

----

## Run on Web 🕸️

1. cd app && npx expo start

1. press `w`

> [!Note]

> `worklet` related code might not work

> [!Note]

> Can turn the app as [progressive web app](https://docs.expo.dev/guides/progressive-web-apps/) (PWA) for more advanced usage

----

## Run on Pear Desktop App 💻

pear-expo export the web code (via react-native-web) to run in Pear Desktop App (which is an Electron-like environment)

> [!Note]

> `worklet` related code might not work

Firstly need export web UI in `app/`:

```sh

cd app && npx expo export -p web

```

Then copy the `app/dist` folder to `pear/dist`

```sh

cd .. && cp -r app/dist pear/dist

```

In `pear/dist` need change the default import path in `pear/dist/index.html` from `/_expo` (absolute path) to `./_expo` (relative path)

```sh

sed -i "s@/_expo@./_expo@g" pear/dist/index.html

```

Then we open the pear desktop with command:

```sh

cd pear && pear dev

```

Then you can use react-native UI with pear desktop

## What's next 🛤️

Can follow [Making a Pear Desktop Application](https://docs.pears.com/guides/making-a-pear-desktop-app) to continue the journey.