Mulai membuat aplikasi desktop dengan React Native untuk Windows
React Native untuk Windows memungkinkan Anda membuat aplikasi Platform Windows Universal (UWP) menggunakan React.
Gambaran Umum React Native
React Native adalah kerangka kerja aplikasi seluler sumber terbuka yang dibuat oleh Facebook. Ini digunakan untuk mengembangkan aplikasi untuk Android, iOS, Web, dan UWP (Windows) yang menyediakan kontrol UI asli dan akses penuh ke platform asli. Bekerja dengan React Native memerlukan pemahaman tentang dasar-dasar JavaScript.
Untuk informasi umum selengkapnya tentang React, lihat halaman Gambaran umum React.
Prasyarat
Persyaratan penyiapan untuk menggunakan React Native untuk Windows dapat ditemukan di halaman Persyaratan Sistem. Pastikan Mode Pengembang diaktifkan di Windows Pengaturan App.
Menginstal React Native untuk Windows
Anda dapat membuat aplikasi desktop Windows menggunakan React Native untuk Windows dengan mengikuti langkah-langkah ini.
Buka jendela baris perintah (terminal) dan navigasikan ke direktori tempat Anda ingin membuat proyek aplikasi desktop Windows.
Anda dapat menggunakan perintah ini dengan Node Package Executor (NPX) untuk membuat proyek React Native tanpa perlu menginstal alat tambahan secara lokal atau global. Perintah akan menghasilkan aplikasi React Native di direktori yang ditentukan oleh
<projectName>
.npx react-native init <projectName>
Jika Anda ingin memulai proyek baru dengan versi React Native tertentu, Anda dapat menggunakan
--version
argumen . Untuk informasi tentang versi React Native, lihat Versi - React Native.npx react-native@X.XX.X init <projectName> --version X.XX.X
Beralih ke direktori proyek dan jalankan perintah berikut untuk menginstal paket React Native untuk Windows:
cd projectName npx react-native-windows-init --overwrite
Untuk menjalankan aplikasi, pertama-tama luncurkan browser web Anda (yaitu. Microsoft Edge), lalu jalankan perintah berikut:
npx react-native run-windows
Men-debug aplikasi desktop React Native Anda menggunakan Visual Studio
Instal Visual Studio 2022 dengan opsi berikut dicentang:
- Beban kerja: pengembangan Platform Windows Universal & Pengembangan desktop dengan C++.
- Komponen Individu: Aktivitas pengembangan &Node.js dukungan pengembangan.
Buka file solusi di folder aplikasi di Visual Studio (misalnya, AwesomeProject/windows/AwesomeProject.sln jika Anda menggunakan AwesomeProject sebagai <projectName>).
Pilih konfigurasi Debug dan platform x64 dari kontrol kotak kombo di sebelah kiri tombol Jalankan dan di bawah item menu Tim dan Alat.
Jalankan
yarn start
dari direktori proyek Anda, dan tunggu hingga pengemas React Native melaporkan keberhasilan.Pilih Jalankan di sebelah kanan kontrol kotak kombo platform di VS, atau pilih item menu Debug-Start> tanpa Debugging. Sekarang Anda melihat aplikasi baru dan Chrome harus dimuat http://localhost:8081/debugger-ui/ di tab baru.
Pilih kunci F12 atau Ctrl+Shift+I untuk membuka Alat Pengembang di browser web Anda.
Men-debug aplikasi desktop React Native Anda menggunakan Visual Studio Code
Buka folder aplikasi Anda di VISUAL Code.
Buat file baru di direktori akar aplikasi, .vscode/launch.json dan tempelkan konfigurasi berikut:
{ "version": "0.2.0", "configurations": [ { "name": "Debug Windows", "cwd": "${workspaceFolder}", "type": "reactnative", "request": "launch", "platform": "windows" } ] }
Tekan F5 atau navigasi ke menu debug (atau tekan Ctrl+Shift+D) dan di menu dropdown Debug pilih "Debug Windows" dan tekan panah hijau untuk menjalankan aplikasi.
Sumber Daya Tambahan:
Windows developer
Saran dan Komentar
https://aka.ms/ContentUserFeedback.
Segera hadir: Sepanjang tahun 2024 kami akan menghentikan penggunaan GitHub Issues sebagai mekanisme umpan balik untuk konten dan menggantinya dengan sistem umpan balik baru. Untuk mengetahui informasi selengkapnya, lihat:Kirim dan lihat umpan balik untuk