国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

vscode 調(diào)試node之npm與nodemon

eechen / 1572人閱讀

摘要：而模式，是連接已經(jīng)啟動的服務(wù)。當(dāng)調(diào)試結(jié)束了，斷開連接就好，明顯比更方便一點。可是，我們并不想時刻開啟調(diào)試功能怎么辦這就需要使用上面說的模式了。使用如下的命令正常的啟動項目當(dāng)我們想要調(diào)試的時候，在的中運行如下的配置完美參考資料我在

更多相關(guān)內(nèi)容見博客 https://github.com/zhuanyongxigua/blog

調(diào)試nodejs有很多方式，可以看這一篇How to Debug Node.js with the Best Tools Available，其中我最喜歡使用的還是V8 Inspector和vscode的方式。

在vscode中，點擊那個蜘蛛的按鈕

就能看出現(xiàn)debug的側(cè)欄，接下來添加配置

選擇環(huán)境

就能看到launch.json的文件了。

啟動的時候，選擇相應(yīng)的配置，然后點擊指向右側(cè)的綠色三角

launch模式與attach模式 
{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceRoot}/index.js"
    },
    {
      "type": "node",
      "request": "attach",
      "name": "Attach to Port",
      "address": "localhost",
      "port": 5858
    }
  ]
}

當(dāng)request為launch時，就是launch模式了，這是程序是從vscode這里啟動的，如果是在調(diào)試那將一直處于調(diào)試的模式。而attach模式，是連接已經(jīng)啟動的服務(wù)。比如你已經(jīng)在外面將項目啟動，突然需要調(diào)試，不需要關(guān)掉已經(jīng)啟動的項目再去vscode中重新啟動，只要以attach的模式啟動，vscode可以連接到已經(jīng)啟動的服務(wù)。當(dāng)調(diào)試結(jié)束了，斷開連接就好，明顯比launch更方便一點。

在debug中使用npm啟動

很多時候我們將很長的啟動命令及配置寫在了package.json的scripts中，比如

"scripts": {
  "start": "NODE_ENV=production PORT=8080 babel-node ./bin/www",
  "dev": "nodemon --inspect --exec babel-node --presets env ./bin/www"
},

我們希望讓vscode使用npm的方式啟動并調(diào)試，這就需要如下的配置

{
  "name": "Launch via NPM",
  "type": "node",
  "request": "launch",
  "runtimeExecutable": "npm",
  "runtimeArgs": [
    "run-script", "dev"    //這里的dev就對應(yīng)package.json中的scripts中的dev
  ],
    "port": 9229    //這個端口是調(diào)試的端口，不是項目啟動的端口
},
在debug中使用nodemon啟動

僅僅使用npm啟動，雖然在dev命令中使用了nodemon，程序也可以正常的重啟，可重啟了之后，調(diào)試就斷開了。所以需要讓vscode去使用nodemon啟動項目。

{
  "type": "node",
  "request": "launch",
  "name": "nodemon",
  "runtimeExecutable": "nodemon",
  "args": ["${workspaceRoot}/bin/www"],
  "restart": true,
  "protocol": "inspector",    //相當(dāng)于--inspect了
  "sourceMaps": true,
  "console": "integratedTerminal",
  "internalConsoleOptions": "neverOpen",
  "runtimeArgs": [    //對應(yīng)nodemon --inspect之后除了啟動文件之外的其他配置
    "--exec",
    "babel-node",
    "--presets",
    "env"
  ]
},

注意這里的runtimeArgs，如果這些配置是寫在package.json中的話，就是這樣的

nodemon --inspect --exec babel-node --presets env ./bin/www

這樣就很方便了，項目可以正常的重啟，每次重啟一樣會開啟調(diào)試功能。

可是，我們并不想時刻開啟調(diào)試功能怎么辦？

這就需要使用上面說的attach模式了。

使用如下的命令正常的啟動項目

nodemon --inspect --exec babel-node --presets env ./bin/www

當(dāng)我們想要調(diào)試的時候，在vscode的debug中運行如下的配置

{
  "type": "node",
  "request": "attach",
  "name": "Attach to node",
  "restart": true,
  "port": 9229
}

完美！

參考資料

Debugging

Node.js Debugging in VS Code

Nodemon + Babel + VSCode

我在github https://github.com/zhuanyongx...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/107686.html

相關(guān)文章

  • Visual Studio Code 前端調(diào)試不完全指南

    摘要：接下來的內(nèi)容將從以下幾方面進行展開調(diào)試前端代碼調(diào)試通過啟動的服務(wù)器要使用的調(diào)試功能，首先就得配置文件。調(diào)試前端代碼通過調(diào)試前端代碼主要依賴于一個插件，該插件主要利用所開放出來的接口來實現(xiàn)對其渲染的頁面進行調(diào)試。 本文最初發(fā)布于我的個人博客：咀嚼之味 Visual Studio Code (以下簡稱 vscode) 如今已經(jīng)代替 Sublime，成為前端工程師們最喜愛的代碼編輯器。它作為...

    dongfangyiyu 評論0 收藏0

  • 開始使用 VSCode 調(diào)試

    一些由淺入深的 VScode 調(diào)試例子，能讓你快速理解和上手 VSCode 調(diào)試。 為什么使用 VSCode ? 我是深度 vi 用戶，之前 Atom 深度使用者，現(xiàn)在基本上轉(zhuǎn)到 VSCode，下面是我選擇 VSCode 的原因： 顏值高，早期不如 Atom，現(xiàn)在已經(jīng)逐漸趕上 vi 支持度好，和 Atom 還差點，但已夠用 調(diào)試體驗好，完爆 Vim 和 Atom 插件多，和 Vim 和 Atom...

    阿羅 評論0 收藏0

  • 如何搭建Electron開發(fā)環(huán)境

    摘要：原文發(fā)表于如何搭建開發(fā)環(huán)境這個項目結(jié)構(gòu)是我在編寫基于和的七牛文件上傳總結(jié)出來的本文主要介紹如何從零開始搭建高效的開發(fā)環(huán)境主要內(nèi)容如下通過合理的目錄劃分來組織代碼使用簡化開發(fā)如何在渲染進程開發(fā)時使用熱更新如何在主進程開發(fā)時使用自動重啟如何在主 原文發(fā)表于 https://lleohao.github.io/2017/09/02/如何搭建Electron開發(fā)環(huán)境/ 這個項目結(jié)構(gòu)是我在編寫...

    TwIStOy 評論0 收藏0

  • vue+koa2+mongo前后端分離restful，配置和部署到云

    摘要：前端項目使用搭建項目，這里就不發(fā)了安裝和配置或加載。目錄下文件修改來個請求，查看結(jié)果。 一。前端項目 1.使用vue-cli（vue2.0）搭建項目，這里就不發(fā)了. axios安裝和配置 ～ npm install axios 1. main.js或app.js加載axios。 import axios from axios Vue.prototype.$axios =...

    miracledan 評論0 收藏0

  • Nuxt項目支持eslint+pritter+typescript

    摘要：腳手架安裝好的基本項目項目名，如，按照提示安裝你想要的東西，本次項目預(yù)裝模式下，默認的項目目錄如下保存自動格式化修復(fù)本人習(xí)慣縮進為個空格，但是生成的項目默認為個，因此需要更改配置文件下的更改為保存時自動修復(fù)錯誤保存自動格式化開啟支 腳手架安裝好nuxt的基本項目 npx create-nuxt-app ，如：npx create-nuxt-app nuxt-ts，按照提示安裝你想要的...

    draveness 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<