Electron - Gỡ lỗi

Chúng tôi có hai quy trình chạy ứng dụng của mình - quy trình chính và quy trình kết xuất.

Vì quá trình kết xuất là quá trình đang được thực thi trong cửa sổ trình duyệt của chúng tôi, chúng tôi có thể sử dụng Chrome Devtools để gỡ lỗi nó. Để mở DevTools, hãy sử dụng phím tắt "Ctrl + Shift + I" hoặc phím <F12>. Bạn có thể xem cách sử dụng devtools tại đây .

Khi bạn mở DevTools, ứng dụng của bạn sẽ giống như được hiển thị trong ảnh chụp màn hình sau:

Gỡ lỗi quy trình chính

DevTools trong cửa sổ trình duyệt Electron chỉ có thể gỡ lỗi JavaScript được thực thi trong cửa sổ đó (tức là các trang web). Để gỡ lỗi JavaScript được thực thi trong quy trình chính, bạn sẽ cần sử dụng trình gỡ lỗi bên ngoài và khởi chạy Electron bằng --debug hoặc --debug-brk switch.

Electron sẽ lắng nghe các thông báo giao thức trình gỡ lỗi V8 trên cổng được chỉ định; trình gỡ lỗi bên ngoài sẽ cần kết nối trên cổng này. Cổng mặc định là 5858.

Chạy ứng dụng của bạn bằng cách sau:

$ electron --debug = 5858 ./main.js

Bây giờ bạn sẽ cần một trình gỡ lỗi hỗ trợ giao thức trình gỡ lỗi V8. Bạn có thể sử dụng VSCode hoặc nút kiểm tra viên cho mục đích này. Ví dụ: chúng ta hãy làm theo các bước sau và thiết lập VSCode cho mục đích này. Làm theo các bước sau để thiết lập -

Tải xuống và cài đặt VSCode . Mở dự án Electron của bạn trong VSCode.

Thêm một tập tin .vscode/launch.json với cấu hình sau -

{
   "version": "1.0.0",
   "configurations": [
      {
         "name": "Debug Main Process",
         "type": "node",
         "request": "launch",
         "cwd": "${workspaceRoot}",
         "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
         "program": "${workspaceRoot}/main.js"
      }
   ]
}

Note - Đối với Windows, sử dụng "${workspaceRoot}/node_modules/.bin/electron.cmd" cho runtimeExecutable.

Đặt một số điểm ngắt trong main.jsvà bắt đầu gỡ lỗi trong Chế độ xem gỡ lỗi. Khi bạn chạm vào các điểm ngắt, màn hình sẽ trông như thế này -

Trình gỡ lỗi VSCode rất mạnh mẽ và sẽ giúp bạn sửa lỗi nhanh chóng. Bạn cũng có các tùy chọn khác nhưnode-inspector để gỡ lỗi các ứng dụng điện tử.