React Native besitzt eine eingebaute Befehleszeilenschnittstelle, die mit dem von Node.js geliefertem Befehl npx (Node Package Execute) aufgerufen wird. Mit diesem Befehl und react-native CLI werden auch die Projekte erstellt.
Hinweis: Der Projektname darf keine Leer- und/oder Sonderzeichen enthalten.
Einfaches Projekt
Ein einfaches Projekt wird ohne zusätzliche Argumente erstellt.
$ npx react-native init ProjectName
Projekt mit einer bestimmten React Native Version
Mit der Option ––version kann man ein Projekt mit einer bestimmten React Native Version anlegen.
$ npx react-native init ProjectName --version X.XX.X
Projekt aus einer Vorlage
Mit der Option ––template wird ein Projekt aus einer Vorlage, z.B. TypeScript erstellt.
$ npx react-native init ProjectName --template react-native-template-typescript
Projekt mit einem App-Titel
Standardmäßig wird das Projekt mit dem gleichen App-Titel wie der Projektname erzeugt. Der Projektname darf aber keine Leer- und Sonderzeichen enthalten. Bei langen, aus mehreren Wörtern zusammengesetzten Namen sieht der App Titel ungewöhnlich aus. Man kann ihn später ändern in der android/app/src/main/res/values/strings.xml bzw. ios/ProjectName/Info.plist Datei. Den Titel kann man aber auch schon beim Anlegen des Projektes vergeben, z.B.:
$ npx react-native init ReactNativeDemo --title "RN Demo App"
Siehe auch: React Native CLI Befehle – init
Projekt-Struktur
Die Struktur eines neu angelegten Projektes ist in drei Bereiche aufzuteilen: gemeinsamer JavaScript Code mit den Node-Modulen, Android-spezifischer und iOS-spezifischer Code.
![Project_Structure [Image]](http://www.technik-tipps-und-tricks.de/wp-content/uploads/2020/01/001_Project_Structure.png)
index.js
Der Einstiegspunkt der App befindet sich in dieser Datei.
App.tsx
Die App-Hauptdatei, die den Screen-View enthält.
app.json
App-Einstellungen.
package.json
Pakete-Konfiguration und Abhängigkeiten.
package-lock.json
Garantiert, dass die mit npm install hinzugefügte Pakete die gleiche, im Projekt benutzte Version haben. Diese Datei soll manuell nicht editiert werden.
tsconfig.json
TypeScript-Konfiguration.
metro.config.js
Metro-Server-Konfiguration.
babel.config.js
Babel-Konfiguration.
.watchmanconfig
Watchman-Konfiguration.
.prettierrc.js
Prettier-Konfiguration.
.gitignore
Dateien und Verzeichnisse die nicht versioniert werden sollen. Siehe: https://git-scm.com/docs/gitignore
.gitattributes
Git-Attribute. Siehe: https://git-scm.com/docs/gitattributes
.eslintrc.js
ESLint-Konfiguration.
.buckconfig
Buck-Konfiguration.
node_modules
Dieser Ordner enthält die Node Module, die von der App benutzt werden.
ios
Der iOS-spezifische und native Code, Builds und Releases.
android
Der Android-spezifische und native Code, Builds und Releases.
__test__
Dieser Ordner enthält die Jest-Testdateien.
War diese Seite für dich informativ? Hat sie dir gefallen und geholfen?
Dann unterstütze die Weiterentwicklung mit einer kleinen Spende!
Die Spenden werden für die Lizenzen sowie neue Hard- und Software verwendet, die für weitere Projekte auf dieser Webseite eingesetzt werden.
