欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

VSCode怎么運行TypeScript? VSCode配置并調(diào)試TypeScript代碼的技巧

  發(fā)布時間：2022-04-29 11:06:51   作者：佚名   我要評論
VSCode怎么運行TypeScript？VSCode中想要運行TypeScript代碼需要我們自己配置，下面我們就來看看VSCode配置并調(diào)試TypeScript代碼的技巧

VSCode如果配置并調(diào)試TypeScript代碼？本篇經(jīng)驗將和大家介紹在VSCode中配置并調(diào)試TypeScript代碼，希望對大家的工作和學習有所幫助！

首先確保本機已安裝Node.js，并全局安裝了ts-node插件，如下圖所示：

使用VSCode打開一個空目錄，在下面創(chuàng)建一個src目錄，并在其下面創(chuàng)建兩個ts腳本，如下圖所示：

在VSCode中點擊左側(cè)的調(diào)試工具欄，選擇“顯示所有自動調(diào)試配置”，點擊“添加配置”，如下圖所示：

選擇Node.js，如下圖所示：

之后在項目根目錄下，默認會創(chuàng)建一個.vscode的目錄，下面包括一個名為launch.json文件，如下圖所示：

右鍵資源管理器面板中的空白目錄，選擇“在集成終端中打開”，如下圖所示：

在項目根目錄下，在終端窗口，輸入命令

npm install typescript ts-node

根目錄下會創(chuàng)建一個名為node_modules的文件夾和package.json文件，如下圖所示：

<

根目錄下我們創(chuàng)建一個名為tsconfig.json文件，內(nèi)容如下

{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"noImplicitAny": true,
"outDir": "./dist",
"sourceMap": true
},
"include": [
"src/**/*"
]
}

，如下圖所示：

打開.vscode/launch.json文件，修改如下

{
"version": "0.2.0",
"configurations": [
{
"name": "調(diào)試TypeScript",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/ts-node/dist/bin.js",
"args": [
"${relativeFile}"
],
"cwd": "${workspaceRoot}",
"protocol": "inspector"
}
]
}

，如下圖所示：

打開某個ts文件，在需要跟蹤調(diào)試的代碼行前面點擊下會出現(xiàn)一個小紅點，說明成功創(chuàng)建了一個斷點，如下圖所示：

左側(cè)工具欄中點擊調(diào)試俺妞，在運行和調(diào)試右側(cè)出現(xiàn)一個綠色三角形，點擊開始調(diào)試，如下圖所示：

測試程序會停止在剛設置斷點的地方，并且上方會出現(xiàn)一個調(diào)試工具欄面板，如下圖所示：

調(diào)試過程中，可以在監(jiān)視選項中添加要跟蹤監(jiān)視的變量，如下圖所示：

以上就是VSCode配置并調(diào)試TypeScript代碼的技巧，希望大家喜歡，請繼續(xù)關注腳本之家。

相關推薦：

vscode怎么導入圖片? vscode把圖片放進程序的技巧

VSCode中git怎么開啟智能提交? VSCode智能提交的設置方法

Visual Studio Code怎么設置持久會話? vscode開啟持久會話的技巧

相關文章

最新評論