[JAVA] Construction d'un environnement Android que même les singes peuvent comprendre [React Native]

À propos de la construction de l'environnement React Native

Comme vous pouvez le voir même les ** super débutants **, il n'y a pas eu de construction d'environnement pour ** Android **, je vais donc le laisser sous forme d'article ~~~! ** (mis à jour en août 2019) ** </ font>

Environnement de développement

MacOS : Mojave/10.14.6 node : v10.15.3 react-native-cli : 2.0.1 react-native : 0.60.4 npm : 6.4.1

Personne cible

Les personnes qui ont réussi à lancer iOS en utilisant react-native, mais qui ont du mal à lancer Android.

Puis commencez !!!!!

① Installez JDK 8

Tout d'abord, mettez le Java requis pour exécuter Android.

  • Remarque: la version Java n'est pas la dernière, 8 est utilisée! (Parce que le propriétaire ne peut pas bien fonctionner avec d'autres versions.)

--Je veux télécharger depuis Oracle, je dois donc créer un compte.

スクリーンショット 2019-08-16 16.59.20.png
  • Une fois votre compte terminé, installez Java 8 en vous référant à l'article suivant.

Procédure d'installation d'Oracle Java 8 (JDK) sur macOS

スクリーンショット 2019-08-16 17.12.23.png
  • Une fois l'installation terminée, vérifiez si Java 8 est installé dans le terminal ou iTerms!
java -version
//OK si vous pouvez confirmer ce qui suit!
java version "1.8.0_221"

② Passez!

Si vous êtes débutant, vous avez tendance à vous sentir comme "je ne sais pas ce qu'est un laissez-passer" ou "je n'ai pas à faire ça", mais c'est vraiment important, alors faites-le! (Cette fois, je vais seulement expliquer comment faire)

  • Attention: cette fois, je vais expliquer aux gens pour bash (les débutants sont généralement cela, alors n'hésitez pas à ignorer cette mise en garde)! (Les personnes utilisant zsh n'auront pas besoin de commentaires)

--Ouvrez le terminal, iTerm et préparez スクリーンショット 2019-08-16 17.25.40.png

--Utilisez vim pour éditer sur le terminal.

//Copie
vi ~/.bash_profile

Ensuite, vous verrez l'écran ci-dessous.

スクリーンショット 2019-08-16 17.36.43.png
  • Vous pouvez utiliser les flèches du clavier pour déplacer le curseur, alors déplacez-vous vers une ligne vide et modifiez-la.
//Parce qu'il ne peut pas être édité tel quel,Appuyez sur "i" → Il sera modifiable.
//Copions celui ci-dessous. Non seulement Java, mais aussi le chemin d'Android Sdk à utiliser plus tard.
export JAVA_HOME=`/usr/libexec/java_home -v 1.8`
export PATH=/usr/local:$PATH:$NODEBREW_HOME/bin:$ANDROID_HOME:$ANDROID_NDK_HOME:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools

――Lorsque vous pouvez copier et coller, appuyez sur la touche esc pour annuler l'état modifié et enregistrer le contenu modifié.

//Je veux enregistrer le contenu édité et terminer l'édition de vim, alors tapez la commande suivante sur l'écran actuel.
//Mise en garde:Assurez-vous de le faire après avoir appuyé sur le bouton esc!
:wq
  • Si vous faites ce qui précède, vous serez renvoyé à l'écran d'origine du terminal. --Je veux refléter les changements dans le fichier de paramètres, alors exécutez la commande suivante dans le terminal.
source ~/.bash_profile

→ Ceci termine le réglage du chemin!

③ Téléchargez et installez Android Studio

--Let's Download Android Studio de l'officiel!

スクリーンショット 2019-08-16 18.01.36.png
  • Une fois le téléchargement terminé, installez-le. Il vous sera demandé de sélectionner un type d'installation, alors sélectionnez «Personnalisé». android sdk android sdk platform performance (intel ® haxm) android virtual device Après avoir confirmé que ces quatre éléments sont cochés, cliquez sur "Suivant" pour installer.

--Lorsque l'installation est terminée, l'écran suivant apparaît. (S'il ne sort pas, lançons Android Studio!)

スクリーンショット 2019-08-16 18.08.48.png

--Installez les fichiers nécessaires tels que le SDK. --Depuis le bas de l'écran initial, lancez Configure-> SDK Manager et installez SDK Platforms → Android 6.0 (Marshmallow). Veuillez cocher au même endroit selon l'écran ci-dessous.

スクリーンショット 2019-08-16 18.13.11.png スクリーンショット 2019-08-16 18.16.32.png スクリーンショット 2019-08-16 18.20.00.png
  • Enfin, cliquez sur «Appliquer» pour télécharger et installer le SDK et créer des outils.

-Ensuite, nous allons créer un AVD! Veuillez procéder selon l'image.

スクリーンショット 2019-08-16 18.33.56.png スクリーンショット 2019-08-16 18.36.06.png スクリーンショット 2019-08-16 18.38.15.png スクリーンショット 2019-08-16 18.38.51.png スクリーンショット 2019-08-16 18.39.31.png → Vous n'avez pas besoin des 2 derniers du nom AVD (le Seigneur en a déjà créé un, donc il a été arbitrairement attribué 2)

⑤ Enfin, lancez l'émulateur

En react-native, iOS peut démarrer l'application avec cli sans lancer le simulateur (émulateur).

Terminal.


react-native run-ios

** Android ne peut pas lancer l'application sans lancer d'abord l'émulateur! ** ** ↑ Voici le point !!!! </ font> Donc, après avoir lancé l'émulateur, je voudrais lancer l'application.

  • Démarrez l'émulateur スクリーンショット 2019-08-16 18.33.56.png スクリーンショット 2019-08-16 18.50.25.png
スクリーンショット 2019-08-16 19.03.59.png
  • Lancez l'application
//Lancez le serveur
npm start
//Lancez l'application sur Android
react-native run-android
  • Remarque: le terminal qui lance le serveur et le terminal qui lance l'application sont séparés. [Méthode recommandée] Vous pouvez le diviser en faisant `` cmd + D '' sur le terminal, donc soit allez dans le répertoire du projet, l'un est de lancer le serveur, l'autre est de lancer l'application ..

Article de référence

https://qiita.com/EBIHARA_kenji/items/2f6938c4fda7cecbeb19 https://qiita.com/takaishota/items/4db36a806a257582fa1f https://qiita.com/tekoneko1997/items/ab1254e4472802514190#android-studio%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB https://qiita.com/ponnjinnka/items/006b632a0b56369451b9

Si vous avez des questions, laissez un commentaire et posez une question ~ ~ ~

Recommended Posts