Hướng dẫn cài đặt react native trên windows

  -  
React Native khuyên download Node, Java SE Development Kit (JDK) với Python2 thông quaChocolatey, đấy là ứng dụng thịnh hành cho Windows
Câu lệnh cài bỏ lên Chocolatey như sau ( chạy CMD cùng với quyền "Run as Administrator"):choco install -y nodejs.install python2 jdk8
Android SDKAndroid SDK PaltformPerformance (Intel ® HAXM) -- cho máy ảoAndroid Virtual Device -- đến máy ảo 2 chọn lọc cuối giành cho máy ảo Android. Nếu bạn đã có thiết bị android rồi thì không phải cài cũng được
Mặc định app android Studio đang cài android SDK tiên tiến nhất nhưng trên home React Native ưu tiên sử dụngAndroid 6.0 (Marshmallow)SDK
Cấu hình setup Android SDK sống màn "Welcome to app android Studio" lựa chọn "Configure" và tiếp nối ấn "SDK Manager"
*

*

*

Google APIsAndroid SDK Platform 23Intel x86 Atom_64 System ImageGoogle APIs hãng sản xuất intel x86 Atom_64 System Image
*

*

Để React Native build ứng dụng bạn nên chỉ định chỗ các bạn cài android Sdk ở đâu. Bạn tuân theo hướng dẫn sau
Việc thứ nhất phải kiểm soát là thiết bị android của bạnWifihoạt động giỏi vì sắp đến tới các bạn sẽ dùng hầu hết bằng Wifi
Đầu tiên, sản phẩm Android của doanh nghiệp phải ở cơ chế "Developer option". Chúng ta VàoSettings→About phonevà clickBuild number7 lần.

Bạn đang xem: Hướng dẫn cài đặt react native trên windows


USB debugging đã bậtAndroid vẫn connect cùng với PCAndroid cùng PC cùng tầm thường 1 mạng nhéa) phương pháp 1: cần sử dụng adb reverse
Debug JS Remotely:Tùy chọn này cho phép bạn debug ứng dụng react native trong trình duyệt y Google Chrome.Enable Live Reload:Tùy lựa chọn này chất nhận được bạn xem lại các biến hóa trên Emulator/Physical apk Device tức thì lập tức khi bạn lưu các chuyển đổi trong mã nguồn của mình.Ứng dụng của các bạn sẽ load lại từ màn hình hiển thị đầu tiênEnable Hot Reloading:Tùy lựa chọn này cũng có thể chấp nhận được bạn xem lại các biến hóa ngay mau lẹ trên Emulator/Physical app android Device nhưng sẽ không còn load lại từ trên đầu mà đang hiển thị ở màn hình mà chúng ta đang chuyển đổi code
Lắc máy để hiển thị thực đơn này

Debug qua ứng dụng Nox


Chờ mang đến chođến khi nó chạy xong, chúng ta thể thấy lỗi app-debugở phần sau cùng khi kết thúc. Tuy nhiênđừng lođấy là do nó phát hiển thị thiết bịđể càiđặt app-debug thôi.

Tiếp theo làtải về cùng càiđặt Nox.Sau lúc càiđặt xong, chúng ta mở Nox lên, bọn họ tiến hành càiđặt khối hệ thống cho nó một chút. Chúng ta click vào hình tượng settings phía góc đề xuất trên screen Nox. Sau khi click vào các bạn sẽ thấy màn dường như vầy hiện ra:

*

Các chúng ta chuyển sang tab càiđặt cao cấp. Phần “Càiđặt tính năng” các bạn chọn thấp cho chính mình nhé. Bởi run app debug yêu cầu k rất cần được set cao tốn bộ nhớ RAM. Phần “Khởiđộng càiđăt” chọn “bản diđộng” và chọn 480×800.Ởđây là mình khuyên bảo setting cho mình nào dùng máy cấu hình thấp. Chúng ta muôn trải nghiệm giỏi hơn thì càiđặt cấu hình vượt trội lên nhé.

Sau lúc càiđặt thông số kỹ thuật xong, các bạn nhấn “Lưu càiđăt” vàđồngý khởiđộng lại phần mềm. Kết quả sẽđược như thế này.

Xem thêm: Cách Vào Control Panel Win 10, 10 Cách Mở Control Panel Trong Windows 10/8

*

Nguyên liệuđã cóđủ chúng ta tiến hành làm bánh. Các bạn mở folder project của react native lên vào theo links sau “project/androidappuildoutputsapk” nhấn 2 lần vào file app-debug.apkđể sở hữu nó vào Nox. Hóng một lúc bạn sẽ thấy appđó bên trên Nox.

*

Kéo file apk-debug.apk vào NOX

Giờ bạn hãy mở nó lên và nếu có thấy lỗi hiện lên thìđừng gồm lo lắng, vị còn vài làm việc nữa new xong. Sau khoản thời gian mở phầm mềm lên bạn quay ra ngoài xem Nodejs cóđang chạy không? nếu không thì mở cửa sổ terminal lên và gõ tiếp lệnhnpm start .

Quay lại cái ứng dụng demo trên Nox của bọn chúng ta. Chúng ta vào biểu tượng 3 vết gạch ngang trên screen Noxở thanh công cụ mặt phải,đó là nút Menu. Sẽđược như thế này.

*

Nhấn chọn “Dev Settings”, một màn hình mới tồn tại vào chúng ta kéo xuống phần DEBUGGING nhân chọn “Debug vps host & post for device”. Tiếp theo sau là bạn nhập theo cú pháp sau “:8081”.

Xem thêm: Chi Tiết 4 Cách Gỡ Bỏ Chế Độ Read Only Trong Word 2007 Mới Nhất 2023

*

Sauđó nhấn “OK”. Chúng ta tiếp tục nhấn Menu và chọn “Reload” là xong.

*

Chúc chúng ta thành công. Bài bác sau mình sẽđi vào phầnđầu chi phí là React Navigation. Mình đã khôngđi ví dụ các bài xích kiểu như kiến thức cơ bản