Hướng dẫn vscode javascript console - bảng điều khiển javascript vscode

Question

Một trong những tính năng chính của Visual Studio Code là hỗ trợ gỡ lỗi tuyệt vời. Trình gỡ lỗi tích hợp của VS Code giúp tăng tốc vòng lặp chỉnh sửa, biên dịch và gỡ lỗi của bạn.

Nội dung chính Show

Tiện ích mở rộng trình gỡ lỗi
Bắt đầu gỡ lỗi
Chụp và gỡ lỗi
Khởi chạy cấu hình
Khởi chạy so với cấu hình đính kèm
Thêm cấu hình mới
Hành động gỡ lỗi
Chế độ chạy
Điểm dừng
Các điểm logpi
Kiểm tra dữ liệu
Launch.Json Thuộc tính
Thay thế biến
Các thuộc tính cụ thể của nền tảng
Cấu hình ra mắt toàn cầu
Chủ đề điểm dừng nâng cao
Điểm dừng có điều kiện
Điểm dừng nội tuyến
Các điểm dừng chức năng
Điểm dừng dữ liệu
BẢO HÀNH DEBUG HƯỚNG DẪN
Chuyển hướng đầu vào/đầu ra sang/từ mục tiêu gỡ lỗi
Gỡ lỗi đa mục tiêu
Cấu hình khởi động hợp chất
Gỡ lỗi từ xa
Tự động mở URI khi gỡ lỗi chương trình máy chủ
Kích hoạt gỡ lỗi qua Edge hoặc Chrome
Kích hoạt cấu hình khởi chạy tùy ý
Bước tiếp theo
Câu hỏi thường gặp
Các kịch bản gỡ lỗi được hỗ trợ là gì?
Tôi không thấy bất kỳ cấu hình khởi chạy nào trong Dropdown Chụp và gỡ lỗi.Chuyện gì thế?

Hướng dẫn vscode javascript console - bảng điều khiển javascript vscode

Tiện ích mở rộng trình gỡ lỗi

Mã VS có hỗ trợ gỡ lỗi tích hợp cho thời gian chạy Node.js và có thể gỡ lỗi JavaScript, TypeScript hoặc bất kỳ ngôn ngữ nào khác được chuyển sang JavaScript.

Để gỡ lỗi các ngôn ngữ và runtimes khác (bao gồm PHP, Ruby, Go, C#, Python, C ++, PowerShell và nhiều loại khác), hãy tìm các phần mở rộng ____99 trong thị trường mã vs hoặc chọn cài đặt các trình gỡ lỗi bổ sung trong menu chạy cấp cao nhất.Install Additional Debuggers in the top-level Run menu.

Dưới đây là một số tiện ích mở rộng phổ biến bao gồm hỗ trợ gỡ lỗi:

Mẹo: Các tiện ích mở rộng được hiển thị ở trên được truy vấn động. Chọn một gạch mở rộng ở trên để đọc mô tả và đánh giá để quyết định tiện ích mở rộng nào là tốt nhất cho bạn.

Bắt đầu gỡ lỗi

Tài liệu sau đây dựa trên trình gỡ lỗi Node.js tích hợp, nhưng hầu hết các khái niệm và tính năng cũng có thể áp dụng cho các trình gỡ lỗi khác.

Nó rất hữu ích để tạo một ứng dụng Node.js mẫu trước khi đọc về gỡ lỗi. Bạn có thể theo dõi hướng dẫn Node.js để cài đặt Node.js và tạo một ứng dụng JavaScript "Hello World" đơn giản (

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

0). Khi bạn đã thiết lập một ứng dụng đơn giản, trang này sẽ đưa bạn thông qua các tính năng gỡ lỗi mã vs.

Chụp và gỡ lỗi

Để hiển thị chế độ xem chạy và gỡ lỗi, chọn biểu tượng Run và Debug trong thanh hoạt động ở phía bên của mã VS. Bạn cũng có thể sử dụng phím tắt ⇧⌘d (Windows, Linux Ctrl+Shift+D).Run and Debug view, select the Run and Debug icon in the Activity Bar on the side of VS Code. You can also use the keyboard shortcut ⇧⌘D (Windows, Linux Ctrl+Shift+D).

Chế độ xem chạy và gỡ lỗi hiển thị tất cả các thông tin liên quan đến chạy và gỡ lỗi và có một thanh hàng đầu với các lệnh gỡ lỗi và cài đặt cấu hình.Run and Debug view displays all information related to running and debugging and has a top bar with debugging commands and configuration settings.

Nếu chạy và gỡ lỗi chưa được cấu hình (không được tạo

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1), mã VS hiển thị chế độ xem khởi động chạy.

Menu chạy cấp cao nhất có các lệnh chạy và gỡ lỗi phổ biến nhất:Run menu has the most common run and debug commands:

Khởi chạy cấu hình

Để chạy hoặc gỡ lỗi một ứng dụng đơn giản trong mã VS, chọn Run và gỡ lỗi trên Debug Start View hoặc nhấn mã F5 và VS sẽ cố gắng chạy tệp hiện đang hoạt động của bạn.Run and Debug on the Debug start view or press F5 and VS Code will try to run your currently active file.

Tuy nhiên, đối với hầu hết các kịch bản gỡ lỗi, việc tạo tệp cấu hình khởi chạy có lợi vì nó cho phép bạn định cấu hình và lưu chi tiết thiết lập gỡ lỗi. Mã VS tiếp tục gỡ lỗi thông tin cấu hình trong tệp

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 nằm trong thư mục

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

3 trong không gian làm việc của bạn (thư mục gốc dự án) hoặc trong cài đặt người dùng hoặc cài đặt không gian làm việc của bạn.

Để tạo tệp

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1, hãy nhấp vào liên kết Tệp Tạo Launch.json trong chế độ xem Khởi động chạy.create a launch.json file link in the Run start view.

Mã VS sẽ cố gắng tự động phát hiện môi trường gỡ lỗi của bạn, nhưng nếu điều này thất bại, bạn sẽ phải chọn nó theo cách thủ công:

Dưới đây là cấu hình khởi chạy được tạo để gỡ lỗi Node.js:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "skipFiles": ["/**"],
      "program": "${workspaceFolder}\\app.js"
    }
  ]
}

Nếu bạn quay lại chế độ xem tệp Explorer (⇧⌘e (Windows, Linux Ctrl+Shift+E)), bạn sẽ thấy mã VS đã tạo thư mục

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

3 và thêm tệp

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 vào không gian làm việc của bạn.⇧⌘E (Windows, Linux Ctrl+Shift+E)), you'll see that VS Code has created a

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

3 folder and added the

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 file to your workspace.

Lưu ý: Bạn có thể gỡ lỗi một ứng dụng đơn giản ngay cả khi bạn không có thư mục mở trong mã VS, nhưng không thể quản lý cấu hình khởi chạy và thiết lập gỡ lỗi nâng cao. Thanh trạng thái mã VS có màu tím nếu bạn không có thư mục mở.: You can debug a simple application even if you don't have a folder open in VS Code, but it is not possible to manage launch configurations and set up advanced debugging. The VS Code Status Bar is purple if you do not have a folder open.

Lưu ý rằng các thuộc tính có sẵn trong cấu hình khởi chạy thay đổi từ trình gỡ lỗi đến trình gỡ lỗi. Bạn có thể sử dụng các đề xuất IntelliSense (⌃Space (Windows, Linux Ctrl+Space)) để tìm ra thuộc tính nào tồn tại cho một trình gỡ lỗi cụ thể. Giúp đỡ Hover cũng có sẵn cho tất cả các thuộc tính.⌃Space (Windows, Linux Ctrl+Space)) to find out which attributes exist for a specific debugger. Hover help is also available for all attributes.

Không cho rằng một thuộc tính có sẵn cho một trình gỡ lỗi tự động cũng hoạt động cho các trình gỡ lỗi khác. Nếu bạn thấy Green Squiggles trong cấu hình khởi chạy của mình, hãy di chuột qua chúng để tìm hiểu vấn đề là gì và cố gắng khắc phục chúng trước khi khởi chạy phiên gỡ lỗi.

Xem lại tất cả các giá trị được tạo tự động và đảm bảo rằng chúng có ý nghĩa cho dự án và môi trường gỡ lỗi của bạn.

Khởi chạy so với cấu hình đính kèm

Trong mã VS, có hai chế độ gỡ lỗi cốt lõi, khởi chạy và đính kèm, xử lý hai quy trình công việc và phân khúc khác nhau của các nhà phát triển. Tùy thuộc vào quy trình làm việc của bạn, có thể khó hiểu khi biết loại cấu hình nào phù hợp với dự án của bạn.Launch and Attach, which handle two different workflows and segments of developers. Depending on your workflow, it can be confusing to know what type of configuration is appropriate for your project.

Nếu bạn đến từ nền công cụ phát triển trình duyệt, bạn có thể không được sử dụng để "khởi chạy từ công cụ của mình", vì phiên bản trình duyệt của bạn đã mở. Khi bạn mở devtools, bạn chỉ đơn giản là gắn devtools vào tab trình duyệt mở của bạn. Mặt khác, nếu bạn đến từ nền máy chủ hoặc máy tính để bàn, việc trình chỉnh sửa của bạn sẽ khởi chạy quy trình của bạn cho bạn và trình soạn thảo của bạn sẽ tự động gắn trình gỡ lỗi của nó vào quy trình mới ra mắt.attaching DevTools to your open browser tab. On the other hand, if you come from a server or desktop background, it's quite normal to have your editor launch your process for you, and your editor automatically attaches its debugger to the newly launched process.

Cách tốt nhất để giải thích sự khác biệt giữa khởi chạy và đính kèm là nghĩ về cấu hình khởi chạy dưới dạng công thức cho cách khởi động ứng dụng của bạn ở chế độ gỡ lỗi trước khi mã vs đính kèm với nó, trong khi cấu hình đính kèm là công thức cho cách kết nối mã vs mã vs Trình gỡ lỗi cho một ứng dụng hoặc quy trình đã chạy.launch and attach is to think of a launch configuration as a recipe for how to start your app in debug mode before VS Code attaches to it, while an attach configuration is a recipe for how to connect VS Code's debugger to an app or process that's already running.

VS Code Debuggers thường hỗ trợ khởi chạy một chương trình ở chế độ gỡ lỗi hoặc gắn vào chương trình đã chạy ở chế độ gỡ lỗi. Tùy thuộc vào yêu cầu (

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

7 hoặc

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

8), các thuộc tính khác nhau được yêu cầu và xác thực và đề xuất ____11 của mã sẽ giúp ích cho điều đó.

Thêm cấu hình mới

Để thêm cấu hình mới vào

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 hiện có, hãy sử dụng một trong các kỹ thuật sau:

Sử dụng IntelliSense nếu con trỏ của bạn được đặt bên trong mảng cấu hình.
Nhấn nút Thêm cấu hình để gọi đoạn mã IntelliSense khi bắt đầu mảng.Add Configuration button to invoke snippet IntelliSense at the start of the array.
Chọn Thêm tùy chọn cấu hình trong menu chạy.Add Configuration option in the Run menu.

Mã VS cũng hỗ trợ các cấu hình khởi chạy hợp chất để bắt đầu nhiều cấu hình cùng một lúc; Để biết thêm chi tiết, xin vui lòng đọc phần này.

Để bắt đầu một phiên gỡ lỗi, trước tiên hãy chọn chương trình khởi động có tên được đặt tên bằng cách sử dụng thả xuống cấu hình trong chế độ xem chạy và gỡ lỗi. Khi bạn có bộ cấu hình khởi chạy, hãy bắt đầu phiên gỡ lỗi với F5.Launch Program using the Configuration dropdown in the Run and Debug view. Once you have your launch configuration set, start your debug session with F5.

Ngoài ra, bạn có thể chạy cấu hình của mình thông qua bảng lệnh (⇧⌘P (Windows, Linux Ctrl+Shift+P)) bằng cách lọc khi gỡ lỗi: Chọn và bắt đầu gỡ lỗi hoặc nhập

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

1 và chọn cấu hình bạn muốn gỡ lỗi.Command Palette (⇧⌘P (Windows, Linux Ctrl+Shift+P)) by filtering on Debug: Select and Start Debugging or typing

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

1 and selecting the configuration you want to debug.

Ngay khi phiên gỡ lỗi bắt đầu, bảng điều khiển gỡ lỗi được hiển thị và hiển thị đầu ra gỡ lỗi và thanh trạng thái thay đổi màu (Orange cho chủ đề màu mặc định):DEBUG CONSOLE panel is displayed and shows debugging output, and the Status Bar changes color (orange for default color themes):

Ngoài ra, trạng thái gỡ lỗi xuất hiện trong thanh trạng thái hiển thị cấu hình gỡ lỗi đang hoạt động. Bằng cách chọn trạng thái gỡ lỗi, người dùng có thể thay đổi cấu hình khởi chạy đang hoạt động và bắt đầu gỡ lỗi mà không cần phải mở chế độ xem chạy và gỡ lỗi.debug status appears in the Status Bar showing the active debug configuration. By selecting the debug status, a user can change the active launch configuration and start debugging without needing to open the Run and Debug view.

Hành động gỡ lỗi

Khi phiên gỡ lỗi bắt đầu, thanh công cụ gỡ lỗi sẽ xuất hiện trên đầu trình soạn thảo.Debug toolbar will appear on the top of the editor.

Hoạt động	Giải trình
Tiếp tục / Tạm dừng F5 F5	Tiếp tục: Tiếp tục thực hiện chương trình/tập lệnh bình thường (lên đến điểm dừng tiếp theo). Tạm dừng: Kiểm tra thực thi mã ở dòng hiện tại và từng dòng gỡ lỗi.: Resume normal program/script execution (up to the next breakpoint). Pause: Inspect code executing at the current line and debug line-by-line.
Bước qua F10 F10	Thực hiện phương thức tiếp theo như một lệnh duy nhất mà không kiểm tra hoặc làm theo các bước thành phần của nó.
Bước vào F11 F11	Nhập phương thức tiếp theo để tuân theo từng dòng thực thi của nó.
Bước ra ⇧f11 (Windows, Linux Shift+F11) ⇧F11 (Windows, Linux Shift+F11)	Khi bên trong một phương thức hoặc chương trình con, hãy quay lại bối cảnh thực hiện trước đó bằng cách hoàn thành các dòng còn lại của phương thức hiện tại như thể nó là một lệnh duy nhất.
Khởi động lại ⇧⌘f5 (Windows, Linux Ctrl+Shift+F5) ⇧⌘F5 (Windows, Linux Ctrl+Shift+F5)	Chấm dứt thực thi chương trình hiện tại và bắt đầu gỡ lỗi một lần nữa bằng cách sử dụng cấu hình chạy hiện tại.
Dừng ⇧f5 (Windows, Linux Shift+F5) ⇧F5 (Windows, Linux Shift+F5)	Chấm dứt thực thi chương trình hiện tại.

Mẹo: Sử dụng cài đặt

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

2 để điều khiển vị trí của thanh công cụ gỡ lỗi. Nó có thể là mặc định
{ "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js", "args": ["myFolder/path/app.js"], "windows": { "args": ["myFolder\\path\\app.js"] } } ] }
3,
{ "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js", "args": ["myFolder/path/app.js"], "windows": { "args": ["myFolder\\path\\app.js"] } } ] }
4 cho chế độ xem chạy và gỡ lỗi hoặc
{ "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js", "args": ["myFolder/path/app.js"], "windows": { "args": ["myFolder\\path\\app.js"] } } ] }
5. Một thanh công cụ gỡ lỗi
{ "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js", "args": ["myFolder/path/app.js"], "windows": { "args": ["myFolder\\path\\app.js"] } } ] }
3 có thể được kéo theo chiều ngang và cũng xuống khu vực biên tập.: Use the setting

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

2 to control the location of the debug toolbar. It can be the default

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

3,

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

4 to the Run and Debug view, or

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

5. A

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

3 debug toolbar can be dragged horizontally and also down to the editor area.

Chế độ chạy

Ngoài việc gỡ lỗi một chương trình, mã VS hỗ trợ chạy chương trình. Hành động gỡ lỗi: Run (bắt đầu mà không gỡ lỗi) được kích hoạt với ⌃f5 (Windows, Linux Ctrl+F5) và sử dụng cấu hình khởi chạy hiện được chọn. Nhiều thuộc tính cấu hình khởi chạy được hỗ trợ trong chế độ 'chạy'. Mã VS duy trì phiên gỡ lỗi trong khi chương trình đang chạy và nhấn nút dừng chấm dứt chương trình.running the program. The Debug: Run (Start Without Debugging) action is triggered with ⌃F5 (Windows, Linux Ctrl+F5) and uses the currently selected launch configuration. Many of the launch configuration attributes are supported in 'Run' mode. VS Code maintains a debug session while the program is running, and pressing the Stop button terminates the program.

Mẹo: Hành động chạy luôn có sẵn, nhưng không phải tất cả các tiện ích mở rộng trình gỡ lỗi đều hỗ trợ 'chạy'. Trong trường hợp này, 'chạy' sẽ giống như 'gỡ lỗi'.: The Run action is always available, but not all debugger extensions support 'Run'. In this case, 'Run' will be the same as 'Debug'.

Điểm dừng

Các điểm dừng có thể được bật bằng cách nhấp vào lề biên tập hoặc sử dụng F9 trên dòng hiện tại. Có thể thực hiện điều khiển điểm ngắt tốt hơn (Bật/Tắt/Thlopply) có thể được thực hiện trong phần Breakpoints của Run và Debug View.editor margin or using F9 on the current line. Finer breakpoint control (enable/disable/reapply) can be done in the Run and Debug view's BREAKPOINTS section.

Các điểm dừng trong lề biên tập thường được hiển thị dưới dạng các vòng tròn đầy màu đỏ.
Các điểm dừng vô hiệu hóa có một vòng tròn màu xám đầy.
Khi một phiên gỡ lỗi bắt đầu, các điểm dừng không thể đăng ký với sự thay đổi trình gỡ lỗi thành một vòng tròn rỗng màu xám. Điều tương tự có thể xảy ra nếu nguồn được chỉnh sửa trong khi phiên gỡ lỗi mà không có hỗ trợ trực tiếp chỉnh sửa.

Nếu trình gỡ lỗi hỗ trợ phá vỡ các loại lỗi hoặc ngoại lệ khác nhau, chúng cũng sẽ có sẵn trong chế độ xem điểm dừng.BREAKPOINTS view.

Lệnh áp dụng lại tất cả các điểm dừng đặt lại tất cả các điểm dừng lại đến vị trí ban đầu của chúng. Điều này rất hữu ích nếu môi trường gỡ lỗi của bạn là các điểm dừng "lười biếng" và "sai" trong mã nguồn chưa được thực thi.Reapply All Breakpoints command sets all breakpoints again to their original location. This is helpful if your debug environment is "lazy" and "misplaces" breakpoints in source code that has not yet been executed.

Tùy chọn, các điểm dừng có thể được hiển thị trong thước tổng quan của trình soạn thảo bằng cách kích hoạt cài đặt

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

7:

Các điểm logpi

Logpoint là một biến thể của điểm dừng không "chia" vào trình gỡ lỗi mà thay vào đó lại ghi lại một thông báo vào bảng điều khiển. Các điểm logpi đặc biệt hữu ích để tiêm ghi nhật ký trong khi gỡ lỗi các máy chủ sản xuất không thể tạm dừng hoặc dừng lại.

Một logpoint được biểu thị bằng biểu tượng hình "kim cương". Tin nhắn nhật ký là văn bản đơn giản nhưng có thể bao gồm các biểu thức được đánh giá trong niềng răng xoăn ('{}').

Cũng giống như các điểm dừng thông thường, các điểm logpi có thể được bật hoặc tắt và cũng có thể được kiểm soát bởi một điều kiện và/hoặc số lần truy cập.

Lưu ý: Các logpoint được hỗ trợ bởi Trình gỡ lỗi Node.js tích hợp của mã, nhưng có thể được thực hiện bằng các tiện ích mở rộng gỡ lỗi khác. Các phần mở rộng Python và Java, ví dụ, hỗ trợ logpoints.: Logpoints are supported by VS Code's built-in Node.js debugger, but can be implemented by other debug extensions. The Python and Java extensions, for example, support Logpoints.

Kiểm tra dữ liệu

Các biến có thể được kiểm tra trong phần biến của chế độ xem chạy và gỡ lỗi hoặc bằng cách di chuột qua nguồn của chúng trong trình chỉnh sửa. Các giá trị biến và đánh giá biểu thức có liên quan đến khung ngăn xếp đã chọn trong phần ngăn xếp cuộc gọi.VARIABLES section of the Run and Debug view or by hovering over their source in the editor. Variable values and expression evaluation are relative to the selected stack frame in the CALL STACK section.

Các giá trị biến có thể được sửa đổi với hành động giá trị đặt từ menu ngữ cảnh của biến. Ngoài ra, bạn có thể sử dụng hành động giá trị sao chép để sao chép giá trị của biến hoặc sao chép làm hành động biểu thức để sao chép biểu thức để truy cập biến.Set Value action from the variable's context menu. Additionally, you can use the Copy Value action to copy the variable's value, or Copy as Expression action to copy an expression to access the variable.

Các biến và biểu thức cũng có thể được đánh giá và xem trong phần Đồng hồ Run và Debug View.Run and Debug view's WATCH section.

Tên và giá trị biến có thể được lọc bằng cách nhập trong khi tiêu điểm là phần biến.VARIABLES section.

Launch.Json Thuộc tính

Có nhiều thuộc tính

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 để giúp hỗ trợ các trình gỡ lỗi và gỡ lỗi khác nhau. Như đã đề cập ở trên, bạn có thể sử dụng IntelliSense (⌃Space (Windows, Linux Ctrl+Space)) để xem danh sách các thuộc tính có sẵn khi bạn đã chỉ định giá trị cho thuộc tính

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

9.⌃Space (Windows, Linux Ctrl+Space)) to see the list of available attributes once you have specified a value for the

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

9 attribute.

Các thuộc tính sau là bắt buộc đối với mỗi cấu hình khởi chạy:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

9 - Loại trình gỡ lỗi sẽ sử dụng cho cấu hình khởi chạy này. Mỗi tiện ích mở rộng được cài đặt đều giới thiệu một loại:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

1 cho trình gỡ lỗi nút tích hợp, ví dụ, hoặc

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

2 và

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

3 cho các tiện ích mở rộng PHP và GO.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

4 - Loại yêu cầu của cấu hình khởi chạy này. Hiện tại,

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

8 và

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

7 được hỗ trợ.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

7 - Tên thân thiện với người đọc xuất hiện trong bản thả xuống cấu hình khởi chạy.

Dưới đây là một số thuộc tính tùy chọn có sẵn cho tất cả các cấu hình khởi chạy:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

8 - Sử dụng các thuộc tính

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

9,

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

0 và

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

5 trong đối tượng

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

8, bạn có thể sắp xếp, nhóm và ẩn các cấu hình và hợp chất trong việc thả xuống cấu hình gỡ lỗi và trong việc gỡ lỗi nhanh chóng.

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

3 - Để khởi chạy một tác vụ trước khi bắt đầu phiên gỡ lỗi, hãy đặt thuộc tính này thành nhãn của một tác vụ được chỉ định trong các tác vụ.json (trong thư mục

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

3 của Workspace). Hoặc, điều này có thể được đặt thành

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

5 để sử dụng tác vụ xây dựng mặc định của bạn.

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

6 - Để khởi chạy một tác vụ vào cuối phiên gỡ lỗi, đặt thuộc tính này thành tên của một tác vụ được chỉ định trong các tác vụ.json (trong thư mục

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

3 của Workspace).

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

8 - Thuộc tính này kiểm soát khả năng hiển thị của bảng điều khiển gỡ lỗi trong phiên gỡ lỗi.

```
"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}
```
9 - Chỉ dành cho tác giả mở rộng gỡ lỗi: Thuộc tính này cho phép bạn kết nối với một cổng được chỉ định thay vì khởi chạy bộ điều hợp gỡ lỗi.for debug extension authors only: this attribute allows you to connect to a specified port instead of launching the debug adapter.
```
{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}
```
0 - Nếu bạn muốn mở URL trong trình duyệt web bất cứ khi nào chương trình được gỡ lỗi xuất ra một thông báo cụ thể đến bảng điều khiển gỡ lỗi hoặc thiết bị đầu cuối tích hợp. Để biết chi tiết, hãy tự động mở URI khi gỡ lỗi chương trình máy chủ bên dưới.

Nhiều người gỡ lỗi hỗ trợ một số thuộc tính sau:

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

1 - thực thi hoặc tệp để chạy khi khởi chạy trình gỡ lỗi

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

2 - Đối số được chuyển cho chương trình để gỡ lỗi

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

3 - Biến môi trường (giá trị

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

4 có thể được sử dụng để "không xác định" một biến)

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

5 - Đường dẫn đến tệp dotenv với các biến môi trường

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

6 - Thư mục làm việc hiện tại để tìm các phụ thuộc và các tệp khác

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

7 - Cổng khi gắn vào quy trình đang chạy

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

8 - phá vỡ ngay lập tức khi chương trình ra mắt

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

9 - Loại bảng điều khiển nào sẽ sử dụng, ví dụ,

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

0,

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

1 hoặc

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

2

Thay thế biến

Mã VS làm cho các đường dẫn thường được sử dụng và các giá trị khác có sẵn dưới dạng các biến và hỗ trợ thay thế biến bên trong các chuỗi trong

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1. Điều này có nghĩa là bạn không phải sử dụng các đường dẫn tuyệt đối trong các cấu hình gỡ lỗi. Ví dụ:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

4 cung cấp đường dẫn gốc của thư mục không gian làm việc,

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

5 Tệp mở trong trình chỉnh sửa hoạt động và

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

6 Biến môi trường 'tên'. Bạn có thể thấy một danh sách đầy đủ các biến được xác định trước trong tham chiếu các biến hoặc bằng cách gọi IntelliSense bên trong các thuộc tính chuỗi

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1.

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

Các thuộc tính cụ thể của nền tảng

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

8 hỗ trợ xác định các giá trị (ví dụ: các đối số sẽ được chuyển cho chương trình) phụ thuộc vào hệ điều hành nơi trình gỡ lỗi đang chạy. Để làm như vậy, đặt một nghĩa đen cụ thể của nền tảng vào tệp

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 và chỉ định các thuộc tính tương ứng bên trong nghĩa đen đó.

Dưới đây là một ví dụ truyền

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

0 cho chương trình khác nhau trên Windows:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

Các thuộc tính hoạt động hợp lệ là

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

1 cho Windows,

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

2 cho Linux và

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

3 cho MacOS. Các thuộc tính được xác định trong một phạm vi ghi đè phạm vi cụ thể của hệ điều hành được xác định trong phạm vi toàn cầu.

Xin lưu ý rằng thuộc tính

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

9 không thể được đặt bên trong phần dành riêng cho nền tảng, bởi vì

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "args": ["myFolder/path/app.js"],
      "windows": {
        "args": ["myFolder\\path\\app.js"]
      }
    }
  ]
}

9 xác định gián tiếp nền tảng trong các kịch bản gỡ lỗi từ xa và điều đó sẽ dẫn đến sự phụ thuộc theo chu kỳ.

Trong ví dụ dưới đây, gỡ lỗi chương trình luôn dừng lại khi nhập ngoại trừ trên macOS:stops on entry except on macOS:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

Cấu hình ra mắt toàn cầu

Mã VS hỗ trợ thêm đối tượng

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

6 bên trong cài đặt người dùng của bạn. Cấu hình

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

6 này sau đó sẽ được chia sẻ trên các không gian làm việc của bạn. Ví dụ:

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

Chủ đề điểm dừng nâng cao

Điểm dừng có điều kiện

Một tính năng gỡ lỗi mã vs mạnh mẽ là khả năng đặt các điều kiện dựa trên các biểu thức, số lần truy cập hoặc kết hợp cả hai.

Điều kiện biểu hiện: Điểm dừng sẽ bị ảnh hưởng bất cứ khi nào biểu thức đánh giá thành
var express = require('express'); var app = express(); app.get('/', function(req, res) { res.send('Hello World!'); }); app.listen(3000, function() { console.log('Example app listening on port 3000!'); });
8.: The breakpoint will be hit whenever the expression evaluates to

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

8.

Số lần truy cập: Việc 'số đếm' kiểm soát số lần một điểm dừng cần phải được nhấn trước khi thực hiện 'phá vỡ'. Liệu một 'số đếm' có được tôn trọng hay không và cú pháp chính xác của biểu thức khác nhau giữa các phần mở rộng trình gỡ lỗi.: The 'hit count' controls how many times a breakpoint needs to be hit before it will 'break' execution. Whether a 'hit count' is respected and the exact syntax of the expression vary among debugger extensions.

Bạn có thể thêm một điều kiện và/hoặc số đếm khi tạo điểm dừng nguồn (với hành động điểm dừng có điều kiện thêm) hoặc khi sửa đổi một điểm hiện có (với hành động điều kiện chỉnh sửa). Trong cả hai trường hợp, một hộp văn bản nội tuyến với menu thả xuống sẽ mở ra nơi bạn có thể nhập biểu thức:Add Conditional Breakpoint action) or when modifying an existing one (with the Edit Condition action). In both cases, an inline text box with a dropdown menu opens where you can enter expressions:

Hỗ trợ chỉnh sửa điều kiện và HIT cũng được hỗ trợ cho các điểm dừng chức năng và ngoại lệ. Bạn có thể bắt đầu chỉnh sửa điều kiện từ menu ngữ cảnh hoặc hành động điều kiện chỉnh sửa nội tuyến mới.function and exception breakpoints. You can initiate condition editing from the context menu or the new inline Edit Condition action.

Một ví dụ về chỉnh sửa điều kiện trong chế độ xem điểm dừng:BREAKPOINTS view:

Nếu một trình gỡ lỗi không hỗ trợ các điểm dừng có điều kiện, các hành động đột phá có điều kiện và điều kiện có điều kiện sẽ bị thiếu.Add Conditional Breakpoint and Edit Condition actions will be missing.

Điểm dừng nội tuyến

Các điểm dừng nội tuyến sẽ chỉ bị tấn công khi thực thi đạt đến cột được liên kết với điểm dừng nội tuyến. Điều này đặc biệt hữu ích khi gỡ lỗi mã Minified có chứa nhiều câu lệnh trong một dòng.

Một điểm dừng nội tuyến có thể được đặt bằng ⇧f9 (Windows, Linux Shift+F9) hoặc thông qua menu ngữ cảnh trong phiên gỡ lỗi. Các điểm dừng nội tuyến được hiển thị nội tuyến trong trình soạn thảo.⇧F9 (Windows, Linux Shift+F9) or through the context menu during a debug session. Inline breakpoints are shown inline in the editor.

Điểm dừng nội tuyến cũng có thể có điều kiện. Chỉnh sửa nhiều điểm dừng trên một dòng có thể thông qua menu ngữ cảnh trong lề trái của trình soạn thảo.

Các điểm dừng chức năng

Thay vì đặt các điểm dừng trực tiếp vào mã nguồn, trình gỡ lỗi có thể hỗ trợ tạo các điểm dừng bằng cách chỉ định tên hàm. Điều này rất hữu ích trong các tình huống mà nguồn không có sẵn nhưng tên hàm được biết đến.

Một điểm dừng chức năng được tạo bằng cách nhấn nút + trong tiêu đề phần BreakPoints và nhập tên hàm. Các điểm dừng chức năng được hiển thị với một hình tam giác màu đỏ trong phần Breakpoints.+ button in the BREAKPOINTS section header and entering the function name. Function breakpoints are shown with a red triangle in the BREAKPOINTS section.

Điểm dừng dữ liệu

Nếu trình gỡ lỗi hỗ trợ các điểm dừng dữ liệu, chúng có thể được đặt từ chế độ xem biến và sẽ bị ảnh hưởng khi giá trị của biến cơ bản thay đổi. Điểm dừng dữ liệu được hiển thị với một hình lục giác màu đỏ trong phần Breakpoints.VARIABLES view and will get hit when the value of the underlying variable changes. Data breakpoints are shown with a red hexagon in the BREAKPOINTS section.

BẢO HÀNH DEBUG HƯỚNG DẪN

Các biểu thức có thể được đánh giá với tính năng Debug Console REP (Read-Eval Print Loop). Để mở bảng điều khiển gỡ lỗi, hãy sử dụng hành động bảng điều khiển gỡ lỗi ở đầu ngăn gỡ lỗi hoặc sử dụng lệnh xem: Debug Console (⇧⌘Y (Windows, Linux Ctrl+Shift+Y)). Biểu thức được đánh giá sau khi bạn nhấn ENTER và bảng điều khiển gỡ lỗi cho thấy các đề xuất khi bạn gõ. Nếu bạn cần nhập nhiều dòng, hãy sử dụng Shift+Enter giữa các dòng và sau đó gửi tất cả các dòng để đánh giá với Enter. Đầu vào bảng điều khiển gỡ lỗi sử dụng chế độ của trình soạn thảo hoạt động, có nghĩa là đầu vào bảng điều khiển gỡ lỗi hỗ trợ tô màu cú pháp, thụt lề, tự động đóng trích dẫn và các tính năng ngôn ngữ khác.Debug Console REPL (Read-Eval-Print Loop) feature. To open the Debug Console, use the Debug Console action at the top of the Debug pane or use the View: Debug Console command (⇧⌘Y (Windows, Linux Ctrl+Shift+Y)). Expressions are evaluated after you press Enter and the Debug Console REPL shows suggestions as you type. If you need to enter multiple lines, use Shift+Enter between the lines and then send all lines for evaluation with Enter. Debug Console input uses the mode of the active editor, which means that the Debug Console input supports syntax coloring, indentation, auto closing of quotes, and other language features.

Lưu ý: Bạn phải ở trong một phiên gỡ lỗi đang chạy để sử dụng bảng điều khiển gỡ lỗi.: You must be in a running debug session to use the Debug Console REPL.

Chuyển hướng đầu vào/đầu ra sang/từ mục tiêu gỡ lỗi

Chuyển hướng đầu vào/đầu ra là trình gỡ lỗi/thời gian chạy cụ thể, vì vậy mã VS không có giải pháp tích hợp hoạt động cho tất cả các trình gỡ lỗi.

Dưới đây là hai cách tiếp cận bạn có thể muốn xem xét:

Khởi chạy chương trình để gỡ lỗi ("mục tiêu gỡ lỗi") theo cách thủ công trong dấu nhắc thiết bị đầu cuối hoặc lệnh và chuyển hướng đầu vào/đầu ra khi cần thiết. Đảm bảo chuyển các tùy chọn dòng lệnh thích hợp cho mục tiêu gỡ lỗi để trình gỡ lỗi có thể gắn vào nó. Tạo và chạy một cấu hình gỡ lỗi "đính kèm" gắn vào mục tiêu gỡ lỗi.
Nếu tiện ích mở rộng trình gỡ lỗi bạn đang sử dụng có thể chạy mục tiêu gỡ lỗi trong thiết bị đầu cuối tích hợp của mã vs (hoặc thiết bị đầu cuối bên ngoài), bạn có thể cố gắng vượt qua cú pháp chuyển hướng shell (ví dụ: "") làm đối số.

Đây là một ví dụ

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 cấu hình:

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

Cách tiếp cận này đòi hỏi "

Gỡ lỗi đa mục tiêu

Đối với các kịch bản phức tạp liên quan đến nhiều quy trình (ví dụ: máy khách và máy chủ), mã VS hỗ trợ gỡ lỗi đa mục tiêu.

Sử dụng gỡ lỗi đa mục tiêu rất đơn giản: sau khi bạn bắt đầu phiên gỡ lỗi đầu tiên, bạn có thể khởi chạy một phiên khác. Ngay sau khi phiên thứ hai đang hoạt động, Code UI chuyển sang chế độ đa mục tiêu:

Cấu hình khởi động hợp chất

Một cách khác để bắt đầu nhiều phiên gỡ lỗi là bằng cách sử dụng cấu hình khởi chạy hỗn hợp. Một cấu hình khởi chạy hợp chất liệt kê tên của hai hoặc nhiều cấu hình khởi chạy sẽ được khởi chạy song song. Tùy chọn

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

3 có thể được chỉ định được chạy trước khi các phiên gỡ lỗi riêng lẻ được bắt đầu. Cờ Boolean

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

1 kiểm soát xem việc chấm dứt thủ công một phiên sẽ dừng tất cả các phiên ghép.compound launch configuration. A compound launch configuration lists the names of two or more launch configurations that should be launched in parallel. Optionally a

"launch": {
    "version": "0.2.0",
    "configurations": [{
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${file}"
    }]
}

3 can be specified that is run before the individual debug sessions are started. The boolean flag

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

1 controls whether manually terminating one session will stop all of the compound sessions.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Server",
      "program": "${workspaceFolder}/server.js"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "Client",
      "program": "${workspaceFolder}/client.js"
    }
  ],
  "compounds": [
    {
      "name": "Server/Client",
      "configurations": ["Server", "Client"],
      "preLaunchTask": "${defaultBuildTask}",
      "stopAll": true
    }
  ]
}

Cấu hình khởi động hợp chất được hiển thị trong menu thả xuống cấu hình khởi chạy.

Gỡ lỗi từ xa

Mã VS không tự mình hỗ trợ gỡ lỗi từ xa: Đây là một tính năng của tiện ích mở rộng mà bạn đang sử dụng và bạn nên tham khảo trang của tiện ích mở rộng trên thị trường để được hỗ trợ và chi tiết.

Tuy nhiên, có một ngoại lệ: Trình gỡ lỗi Node.js có trong mã VS hỗ trợ gỡ lỗi từ xa. Xem chủ đề gỡ lỗi Node.js để tìm hiểu cách định cấu hình này.

Tự động mở URI khi gỡ lỗi chương trình máy chủ

Phát triển một chương trình web thường yêu cầu mở một URL cụ thể trong trình duyệt web để nhấn mã máy chủ trong trình gỡ lỗi. Mã VS có tính năng tích hợp "ServerReadyAction" để tự động hóa tác vụ này.serverReadyAction" to automate this task.

Dưới đây là một ví dụ về ứng dụng Express Node.js Express:

var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.send('Hello World!');
});

app.listen(3000, function() {
  console.log('Example app listening on port 3000!');
});

Ứng dụng này lần đầu tiên cài đặt trình xử lý "Hello World" cho URL "/" và sau đó bắt đầu nghe các kết nối HTTP trên cổng 3000. Cổng được công bố trong bảng điều khiển gỡ lỗi và thông thường, nhà phát triển sẽ nhập

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

2 vào ứng dụng trình duyệt của họ .

Tính năng ServerReadyAction cho phép thêm thuộc tính có cấu trúc

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

0 vào bất kỳ cấu hình khởi chạy nào và chọn "hành động" sẽ được thực hiện:serverReadyAction feature makes it possible to add a structured property

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

0 to any launch config and select an "action" to be performed:

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

Ở đây thuộc tính

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

4 mô tả biểu thức chính quy để khớp chuỗi đầu ra của chương trình thông báo cổng. Mẫu cho số cổng được đưa vào ngoặc đơn để nó có sẵn dưới dạng nhóm chụp biểu thức chính quy. Trong ví dụ này, chúng tôi chỉ trích xuất số cổng, nhưng cũng có thể trích xuất một URI đầy đủ.

Thuộc tính

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

5 mô tả cách số cổng được biến thành URI.

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

6 đầu tiên được thay thế bằng nhóm chụp đầu tiên của mẫu phù hợp.

URI kết quả sau đó được mở bên ngoài mã VS ("bên ngoài") với ứng dụng tiêu chuẩn được cấu hình cho sơ đồ của URI.

Kích hoạt gỡ lỗi qua Edge hoặc Chrome

Ngoài ra,

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

7 có thể được đặt thành

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

8 hoặc

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

9. Trong chế độ này, một thuộc tính Debuggers0 có thể được thêm vào được chuyển đến phiên gỡ lỗi Chrome hoặc Edge.

Để đơn giản hóa mọi thứ một chút, hầu hết các thuộc tính đều là tùy chọn và chúng tôi sử dụng các giá trị dự phòng sau:

Mẫu: Debuggers1 phù hợp với các tin nhắn thường được sử dụng "nghe trên cổng 3000" hoặc "Bây giờ nghe trên: https: // localhost: 5001".: Debuggers1 which matches the commonly used messages "listening on port 3000" or "Now listening on: https://localhost:5001".
Uriformat: Debuggers2: Debuggers2
Webroot: Debuggers3: Debuggers3

Kích hoạt cấu hình khởi chạy tùy ý

Trong một số trường hợp, bạn có thể cần định cấu hình các tùy chọn bổ sung cho phiên gỡ lỗi trình duyệt-hoặc sử dụng một trình gỡ lỗi khác hoàn toàn. Bạn có thể làm điều này bằng cách đặt

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

7 thành Debuggers5 với thuộc tính

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/node_modules/gulp/bin/gulpfile.js",
      "stopOnEntry": true,
      "osx": {
        "stopOnEntry": false
      }
    }
  ]
}

7 được đặt thành tên của cấu hình khởi chạy để bắt đầu khi

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",

  "serverReadyAction": {
    "pattern": "listening on port ([0-9]+)",
    "uriFormat": "http://localhost:%s",
    "action": "openExternally"
  }
}

4 được khớp.

Cấu hình khởi động được đặt tên phải nằm trong cùng một tệp hoặc thư mục như tệp có

{
  "name": "launch program that reads a file from stdin",
  "type": "node",
  "request": "launch",
  "program": "program.js",
  "console": "integratedTerminal",
  "args": ["<", "in.txt"]
}

0.

Ở đây tính năng serverReadyAction trong hành động:serverReadyAction feature in action:

Bước tiếp theo

Để tìm hiểu về hỗ trợ gỡ lỗi Node.js của mã vs, hãy xem:

Node.js - mô tả trình gỡ lỗi node.js, được bao gồm trong mã vs.
TypeScript - Trình gỡ lỗi Node.js cũng hỗ trợ gỡ lỗi TypeScript.

Để xem các hướng dẫn về những điều cơ bản của Node.js gỡ lỗi, hãy xem các video này:

Video giới thiệu - Gỡ lỗi - Hiển thị những điều cơ bản của việc gỡ lỗi.
Bắt đầu với gỡ lỗi Node.js - cho thấy cách gắn trình gỡ lỗi vào quy trình Running Node.js.

Để tìm hiểu về việc gỡ lỗi hỗ trợ cho các ngôn ngữ lập trình khác thông qua các phần mở rộng mã vs:

C++
Python
Java

Để tìm hiểu về hỗ trợ chạy nhiệm vụ của mã vs, hãy truy cập:

Nhiệm vụ - mô tả cách chạy các nhiệm vụ với Gulp, Grunt và Jake và cách hiển thị lỗi và cảnh báo.

Để viết tiện ích mở rộng trình gỡ lỗi của riêng bạn, hãy truy cập:

Tiện ích mở rộng trình gỡ lỗi - Sử dụng mẫu giả để minh họa các bước cần thiết để tạo tiện ích mở rộng Debug mã VS.

Câu hỏi thường gặp

Các kịch bản gỡ lỗi được hỗ trợ là gì?

Việc gỡ lỗi các ứng dụng dựa trên Node.js được hỗ trợ trên Linux, MacOS và Windows ra khỏi hộp với mã VS.Nhiều kịch bản khác được hỗ trợ bởi các phần mở rộng mã VS có sẵn trên thị trường.

Vấn đề phổ biến nhất là bạn đã không thiết lập

{
  "type": "node",
  "request": "launch",
  "name": "Launch Program",
  "program": "${workspaceFolder}/app.js",
  "cwd": "${workspaceFolder}",
  "args": ["${env:USERNAME}"]
}

1 hoặc có lỗi cú pháp trong tệp đó.Ngoài ra, bạn có thể cần phải mở một thư mục, vì việc gỡ lỗi không có cửa sổ không hỗ trợ cấu hình khởi chạy.

11/2/2022

programming javascript Vscode launch.json vscode c++ launch.json vscode python Node js Code JavaScript online