Cách tốt nhất để gỡ lỗi ứng dụng Ionic trên thiết bị.

Kỹ thuật quan điểm của tôi.

TL; DR

  • Hãy chắc chắn rằng bạn có thể triển khai đến thiết bị của bạn.
  • Cắm thiết bị của bạn.
  • chạy:
ionic cordova chạy  --device -l --debug
  • Đối với Android, hãy mở Chrome và truy cập Web Inspector.
    Mở ~> Thêm công cụ> Thiết bị từ xa
    Chọn thiết bị của bạn và nhấp vào Kiểm tra.
  • Đối với iOS, mở Safari và bật Develop Menu.
    Mở ~ Phát triển> thiết bị của tôi> địa chỉ IP của tôi.

Tác giả Ram Pointings Ramblings

Hãy nói với bạn rằng bạn đã tạo ra ứng dụng đáng kinh ngạc nhất. Mọi thứ đều hoạt động tốt cho đến khi bạn muốn thêm một số plugin Cordova mà bạn không quá quen thuộc. Bây giờ ứng dụng của bạn không còn hoạt động trong trình duyệt. Và nếu bạn muốn kiểm tra nó trên trình giả lập hoặc thiết bị, bạn phải xây dựng lại nhiều lần để xem từng thay đổi. Và trong khi ghi nhật ký bảng điều khiển JS hoạt động, các điểm dừng của trình gỡ lỗi thì không. Điều này có thể làm cho bước cuối cùng của việc xây dựng và gỡ lỗi ứng dụng của bạn trở nên chậm chạp và tẻ nhạt.

Ứng dụng gỡ lỗi đúng cách là tuyệt vời. Tuy nhiên, nó có thể là cảm động. Giống như một cáp phụ tồi mà bạn cần giữ đúng vị trí hoặc nó ngừng hoạt động. Đôi khi tôi có thể khiến mọi thứ hoạt động hoàn hảo một lần. Sau đó, tôi sẽ làm mọi thứ theo thứ tự sai hoặc chạm vào một cái gì đó một cách hài hước và nó lại giành được công việc.

Tôi đã dành (lãng phí) nhiều tuần để cố gắng để bài viết này hoàn hảo. Tôi hy vọng với việc thực hành Tôi sẽ làm việc với tất cả các kink, nhưng tôi đã không có. Thông tin này thực sự quan trọng để phát triển với Ionic và tôi không thể tìm thấy tất cả ở một nơi khác. Vì vậy, bài viết này cần phải được viết như là. Nó không hoàn hảo nhưng ít nhất nó có sẵn. Nói cách khác, cuối cùng tôi đã phải nói rằng Fucks IT, CHÚNG TÔI ĐÃ LÀM TRỰC TUYẾN!

Tôi đã bắt đầu bài viết này 6 tháng trước và mọi thứ đã tốt hơn rất nhiều kể từ đó. XCode ít tinh tế hơn một chút. Ionic sườn gan tải ổn định hơn. Ionic tự động đưa danh sách trắng IP của bạn. Và như vậy.

Công cụ yêu cầu

Phần cứng

  • Một máy Mac. Tôi đoán có nhiều cách để xây dựng ứng dụng iOS trong Linux và Windows. Nhưng hãy để đối mặt với điều đó, Apple có những thứ bị khóa khá chặt và bạn sẽ phải bơi lên trên toàn bộ thời gian nếu bạn không chỉ sử dụng máy Mac.
  • Một điện thoại Android hoặc iPod Touch dựa trên Android tương đương.
  • Một chiếc iPhone hoặc iPod Touch.
  • (tùy chọn) Một máy tính bảng có thể hữu ích nhưng bạn chỉ có thể điều chỉnh kích thước màn hình từ các công cụ dành cho nhà phát triển trong trình duyệt của mình.
  • Một số ít cáp cho mỗi thiết bị. Hãy tiết kiệm cho mình một cơn đau đầu và chỉ cần ném chúng ra và sử dụng một cái khác khi chúng bắt đầu xấu đi. Tôi mua chúng trong 6 gói từ Amazon.
  • (tùy chọn) Bộ chia USB với các nút nguồn cho mỗi ổ cắm sẽ giúp bạn tiết kiệm rất nhiều việc cắm và rút phích cắm. Điều đó sẽ lần lượt kéo dài tuổi thọ của cáp của bạn.

Phần mềm

  • Studio Android
  • Xode
  • Chrome
  • cuộc đi săn, cuộc hành trình

Giải pháp

Trước khi bạn bắt đầu

Nhận càng xa càng tốt mà không cần Cordova. Sau đó, thêm một chút nữa bằng cách sử dụng Cordova mocking. Tuy nhiên, bạn muốn kiểm tra trên thiết bị sớm và thường xuyên. Mặc dù mọi thứ bạn làm đang có thể là nhà phát triển web cơ bản, có thể có những vấn đề kỳ lạ với việc JS không hoạt động trong WebView.

Tôi sẽ giả sử bạn biết cách xây dựng một ứng dụng Ionic. Nếu không có nhiều hướng dẫn, vậy thì hãy bỏ qua điều đó. Tôi cũng sẽ giả định rằng bạn biết cách lấy chứng chỉ và như vậy từ Apple và rằng bạn biết cách triển khai lên iOS và Android từ dòng lệnh. Nếu không, một lần nữa, có hướng dẫn.

Khắc phục sự cố các vấn đề triển khai cơ bản

Điều đầu tiên đầu tiên. Bạn cần xây dựng và chạy ứng dụng của mình từ Xcode và Android Studio. Nếu bạn có thể để nó chạy nó trong các ứng dụng đó, bạn có thể quên dòng lệnh.

Hầu hết các lỗi iOS tôi đã thấy là do ký quyền. Đôi khi chúng có thể được sửa bằng cách bỏ chọn và kiểm tra lại Tự động quản lý việc ký tên và sau đó chọn lại nhóm của bạn. Hãy chắc chắn rằng chứng chỉ và hồ sơ cung cấp của bạn đều theo thứ tự.

Hầu hết các lỗi Android là do cáp xấu. Nếu bạn gặp vấn đề, hãy rút phích cắm và cắm lại vào thiết bị của bạn. Sau đó, đảm bảo gỡ lỗi được bật và chế độ USB của bạn được đặt thành PTP (ảnh).

Don luôn mong đợi mọi thứ chỉ hoạt động. Bạn phải vặn vẹo nó, chỉ một chút thôi.

Ionic View, Trình giả lập, thiết bị của bạn và trình duyệt đều sẽ có các vấn đề khác nhau vì những lý do khác nhau. Tôi chỉ thích sử dụng trình duyệt và thiết bị của mình vì vậy tôi không dành nhiều giờ để gỡ lỗi mà don don thực sự tồn tại.

Khi bạn đã cài đặt mọi thứ và bạn biết rằng bạn có thể triển khai thành công ứng dụng của mình lên thiết bị, mọi thứ trở nên dễ dàng hơn. Chọn thiết bị ưa thích của bạn và làm theo hướng dẫn.

Android

Plugin Android của bạn.

Từ dòng lệnh chạy:

ionic cordova chạy android --device -l --debug

Mở Chrome và đi đến Trình kiểm tra web. Nhấp vào ba dấu chấm bên cạnh Mục Đóng Đóng X. Đi đến Công cụ khác> Thiết bị từ xa. Nếu thiết bị của bạn được cắm, bạn sẽ thấy nó trong Thiết bị. Nơi hài hước cho nó. Nhấp vào thiết bị của bạn. Nếu máy chủ của bạn hoạt động và chạy, bạn sẽ thấy máy chủ IP IP. Nhấp vào Kiểm tra. Một cửa sổ mới sẽ mở ra.

iOS

Plugin thiết bị iOS của bạn.

Từ dòng lệnh chạy:

ionic cordova chạy ios --device -l --debug

Mở Safari và mở tùy chọn. Chọn tab Nâng cao và nhấp vào Menu Show Show Develop trong thanh menu. Nhấp vào Phát triển trong thanh menu và tìm thiết bị của bạn. Khi bạn tìm thấy nó, di chuột qua nó và nhấp vào IP trong menu phụ. Một cửa sổ mới sẽ mở ra.

Tìm hạnh phúc của bạn

Trong Chrome, bạn sẽ thấy một bản sao của màn hình thiết bị của bạn và có quyền truy cập vào bảng điều khiển nơi bạn có thể thấy lỗi. Trong Safari ít nhất bạn có thể thấy bảng điều khiển. Hãy thử thay đổi một số văn bản trong trang mà bạn đang xem. Nó sẽ tải lại các lượt xem giống như khi bạn thực hiện phân phối ion. Sự khác biệt là bây giờ bạn có thể thấy những thay đổi trực tiếp trên thiết bị của mình. Bạn cũng có thể làm gián đoạn quá trình thực thi ứng dụng của mình bằng trình gỡ lỗi và in đầu ra từ thiết bị sang bàn điều khiển. Tuyệt vời nhất, giờ đây bạn có thể thử nghiệm các plugin Cordova của mình với tất cả sự tiện lợi của việc phát triển trình duyệt cơ bản. Và đừng quên rằng bạn có thể gây ấn tượng với khách hàng bằng cách tải ứng dụng của họ trên thiết bị của họ và tương tác làm việc với thiết kế với họ.