Gỡ lỗi ứng dụng trong Project IDX

Project IDX cung cấp một số cách để gỡ lỗi ứng dụng, ngay từ không gian làm việc. Các ứng dụng web và Flutter cung cấp Lighthouse và Công cụ của Chrome cho nhà phát triển trong bản xem trước web của Chrome trong không gian làm việc của bạn. Các ứng dụng Flutter có bản xem trước dành cho iOS, Android và web để bạn có thể phát hiện và kiểm thử ứng dụng trong khi lập trình. Bảng điều khiển gỡ lỗi tích hợp sẵn hỗ trợ gỡ lỗi tự động cho hầu hết các ngôn ngữ phổ biến và gỡ lỗi tuỳ chỉnh mà bạn có thể xác định trong tệp launch.json trong không gian làm việc của mình.

Xem trước ứng dụng

IDX cung cấp bản xem trước ứng dụng trong không gian làm việc cho ứng dụng web (Chrome và Safari dành cho thiết bị di động) và ứng dụng Flutter (iOS, Android, Chrome). Bản xem trước của Android và Chrome hỗ trợ tính năng tải lại nóng và làm mới nhanh, đồng thời cung cấp đầy đủ các tính năng của trình mô phỏng. Trình mô phỏng Safari và iOS cung cấp các bản xem trước trực quan và tương tác trên nhiều thiết bị iOS, đồng thời mô phỏng trải nghiệm iOS cho ứng dụng di động và web.

Để tìm hiểu thêm về bản xem trước IDX, hãy xem phần Xem trước ứng dụng.

Sử dụng Công cụ của Chrome cho nhà phát triển cho bản xem trước trên web (thử nghiệm)

Công cụ của Chrome cho nhà phát triển giúp bạn chẩn đoán các vấn đề trong ứng dụng ngay từ bản xem trước trên web. Bạn có thể truy cập Công cụ cho nhà phát triển Chrome trong bảng xem trước trên web IDX giống như cách bạn mở Công cụ cho nhà phát triển từ trình duyệt Chrome. Bảng điều khiển Công cụ cho nhà phát triển được thu nhỏ trong bản xem trước trên web của IDX

Tính năng này đang ở giai đoạn thử nghiệm trong quá trình chúng tôi nỗ lực tạo ra trải nghiệm người dùng lý tưởng. Gửi ý kiến phản hồi cho chúng tôi để giúp chúng tôi cải thiện phiên bản này.

  1. Thêm Công cụ của Chrome cho nhà phát triển vào không gian làm việc IDX của bạn:

    1. Mở cửa sổ Cài đặt bằng cách nhấp vào biểu tượng bánh răng hoặc nhấn Ctrl + , (trên Windows/Linux/ChromeOS) hoặc Cmd + , (trên MacOS).
    2. Tìm chế độ cài đặt IDX: Công cụ dành cho nhà phát triển web rồi chọn Bật Công cụ của Chrome cho nhà phát triển để xem trước web (cần phải tải lại trình duyệt). Nếu sử dụng tệp settings.json, bạn cũng có thể đặt "IDX.webDevTools": true.
    3. Làm mới cửa sổ trình duyệt rồi tải lại không gian làm việc IDX của bạn.
  2. Mở bản xem trước trên web trong Project IDX: Mở bảng lệnh (Cmd+Shift+P trên Mac hoặc Ctrl+Shift+P trên ChromeOS, Windows hoặc Linux) rồi chọn Project IDX: Show Web Preview (Dự án IDX: Hiện bản xem trước trên web).

  3. Bảng điều khiển Công cụ cho nhà phát triển được thu nhỏ trong bảng xem trước trên web. Nhấp vào thanh Công cụ cho nhà phát triển để mở rộng bảng điều khiển và sử dụng Công cụ cho nhà phát triển bên trong bảng xem trước trên web.

Sử dụng bảng điều khiển Công cụ cho nhà phát triển trong bản xem trước trên web IDX giống như cách bạn gỡ lỗi ứng dụng trong trình duyệt Chrome.

Chạy Lighthouse cho bản xem trước trên web

Lighthouse kiểm tra ứng dụng của bạn dựa trên các danh mục kiểm tra cụ thể mà bạn chọn, sau đó trả về một báo cáo kèm theo các phát hiện và đề xuất. Bạn có thể chạy báo cáo Lighthouse ngay từ bản xem trước trên web trong Project IDX.

  1. Mở bản xem trước trên web trong Project IDX: Mở bảng lệnh (Cmd+Shift+P trên Mac hoặc Ctrl+Shift+P trên ChromeOS, Windows hoặc Linux) rồi chọn Project IDX: Show Web Preview (Dự án IDX: Hiện bản xem trước trên web).

  2. Nhấp vào biểu tượng kiểm tra hiệu suất trong thanh công cụ xem trước trên web. hình ảnh biểu tượng kiểm tra tốc độ

  3. hình ảnh bảng điều khiển của ngọn hải đăng trong idx Trong bảng điều khiển Lighthouse, hãy chọn danh mục kiểm tra mà bạn muốn. Bạn có thể chọn trong số các báo cáo kiểm tra hiệu suất, khả năng tiếp cận, mức độ phù hợp với các phương pháp hay nhất, SEOhiệu suất của Ứng dụng web tiến bộ. Nhấp vào Analyze page (Trang phân tích) để tạo các báo cáo.

    Có thể mất vài phút để tạo báo cáo.

  4. Sau khi báo cáo xuất hiện trong bảng điều khiển Lighthouse, bạn có thể xem xét phát hiện cho từng danh mục kiểm tra hoặc chuyển đổi giữa các danh mục kiểm tra bằng cách nhấp vào điểm số và tên danh mục.

Sử dụng Bảng điều khiển gỡ lỗi

Project IDX bao gồm Bảng điều khiển gỡ lỗi tích hợp sẵn từ Code OSS. Sử dụng bảng điều khiển này để gỡ lỗi ứng dụng bằng trình gỡ lỗi có sẵn cho các ngôn ngữ lập trình phổ biến nhất, hoặc thêm một tiện ích gỡ lỗi từ VSCode Marketplace.

Nếu bạn muốn viết phương thức gỡ lỗi tuỳ chỉnh, hãy thêm tệp launch.json vào không gian làm việc.