Einführung in die RN-Entwicklung und -Forschung (1) Projektkonstruktion

Ein einfaches Projekt ist eigentlich sehr einfach einzurichten und auszuführen.

Das Wesentliche ist: Installieren Sie zuerst node.js, installieren Sie dann react-native-cli, das Befehlszeilentool, und verwenden Sie dann das Befehlszeilentool react-native, um das Projekt zu erstellen. Vier Schritte.

Die erste ist die Installation von nodejs. Die Installation von nodejs hängt mit Ihrem Betriebssystem zusammen. Es gibt viele Informationen, daher werde ich sie nicht wiederholen.

Warum zuerst node.js installieren? Weil sich fast alle JS-Front-End-Ökosysteme jetzt um npm drehen (Node Package Manager).

Verwenden Sie nach der Installation von node.js npm, um die Befehlszeilenschnittstelle von react-native zu installieren.

Der Befehl lautet:

npm install -g react-native-cli

Zu den Befehlen auf der chinesischen RN-Website:

npm install -g yarn react-native-cli

Tatsächlich werden Garn und React-Native-Cli gleichzeitig installiert.

Nachdem der obige Befehl installiert wurde, können Sie den folgenden Befehl ausführen:

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

Die Funktion des ersten Befehls besteht darin, ein RN-Projekt zu erstellen

react-native init AwesomeProject

Die Funktion des zweiten Befehls. . . Ist in dieses Projekt einzutreten (ganz zu schweigen davon, ich denke, jeder weiß es)

cd AwesomeProject

Die Funktion des dritten Befehls besteht darin, das erstellte RN-Projekt auszuführen.

react-native run-android

Wenn Sie den Android-Emulator zu diesem Zeitpunkt geöffnet haben, sollte die erste RN-Anwendung bereits ausgeführt werden.

Der Effekt nach dem Laufen ist wie folgt:

Es ist eigentlich sehr einfach, oder?

Um die Konsolenausgabe des RN-Projekts anzuzeigen, müssen wir Watchman installieren, aber ich werde hier nicht auf Details eingehen. Sie können die offizielle Website von RN oder die chinesische Website besuchen, um den Inhalt zu überprüfen.

Der Link lautet wie folgt:

RN Chinese Network

https://reactnative.cn/docs/0.51/getting-started.html 

Offizielle RN-Website

http://facebook.github.io/react-native/docs/getting-started.html