Essayez d'exécuter l'application de démonstration React Navigation v5 à l'aide de Docker + Expo (pour Mac)

Avant

Docker + Expo Application de démonstration pour la version 5 de React Navigation La procédure d'exécution sur un appareil mobile (iOS ou Android) en utilisant est publiée.

Si vous étudiez React Navigation, veuillez l'essayer.

Pour le moment (30/09/2020), le contrôle de fonctionnement du terminal Android n'est pas terminé.

Nous achetons actuellement des appareils Androido et nous les vérifierons à une date ultérieure, mais en théorie, les appareils Android devraient fonctionner avec la même procédure.

Chaque information de terminal

• PC

  • Mac OS Catalina Ver.10.15.6
  • docker version 19.03.12, build 48a66213fe
  • docker-compose version 1.26.2, build eefe0d31

• iPhone

  • iPhone XR
  • iOS:13.7

supposition

• Compte Expo enregistré

La procédure d'enregistrement d'un compte est décrite dans un article séparé "Comment créer un compte Expo".

• PC

--docker, docker-compose installé --git installé

• ordinateur portable

--Expo Client installé

La procédure d'installation est décrite dans l'article séparé "Comment installer et configurer l'application cliente Expo sur iPhone".

procédure

1. Utilisez le terminal pour créer et déplacer le dossier du projet.

   mkdir react_navigation_demo
   cd react_navigation_demo
   

2. Téléchargez le référentiel react-navigation sur github avec la commande clone.

   git clone https://github.com/react-navigation/react-navigation.git
   

3. Créez chaque fichier de configuration pour Docker et EXPO.

   touch dockerfile
   touch docker-compose.yml
   touch .env
   

4. Décrivez les paramètres dans le fichier docker

   ```
   FROM node:14-alpine
   
   WORKDIR /usr/src/app/
   
   RUN apk update && apk add bash
   ```
   

5. Décrivez les paramètres dans docker-compose.yml

   ```
   version: "3"
   services:
   react-navigation:
     build: ./
     volumes:
       - ./react-navigation/:/usr/src/app
     env_file: .env
     command: bash -c "cd example && yarn start"
     ports:
       - "19000:19000"
       - "19001:19001"
       - "19002:19002"
   ```
   

6. Décrivez les paramètres dans .env

Il est nécessaire de définir l'adresse IP de chaque terminal qui utilise Expo. - ADB_IP: Veuillez spécifier l'adresse IP du terminal mobile. Il semble que vous puissiez spécifier plusieurs éléments séparés par des virgules. - REACT_NATIVE_PACKAGER_HOSTNAME:

Veuillez spécifier l'adresse IP du terminal PC qui démarre Docker.

    ```
    ADB_IP=192.168.1.106, 192.168.1.107
    REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.204
    ```

1. Créez l'environnement Docker

   docker-compose build
   

2. Configuration sur le conteneur Docker

3. Connectez-vous au conteneur Docker

   ```
   docker-compose run --rm react-navigation bash --login
   ```
   

4. Accédez au dossier d'exemple

   ```
   cd example
   ```
   

5. Mettre en place avec du fil

   ```
   yarn
   ```
   

6. Fermez la connexion avec le conteneur

   ```
   exit
   ```
   

7. Démarrez Docker

   docker-compose up
   

8. Lisez le code QR affiché sur le terminal avec votre appareil mobile


1. L'application de démonstration se lancera sur votre appareil mobile