ホームページ >開発ツール >VSCode >vscode npmの実行方法

vscode npmの実行方法

藏色散人
藏色散人オリジナル
2019-11-18 09:42:407115ブラウズ

vscode npmの実行方法

#vscode npm を実行する方法?

vscode ノード npm と nodemon をデバッグする

nodejs をデバッグするにはさまざまな方法があります。利用可能な最高のツールを使用して Node.js をデバッグする方法の記事を読むことができます。その中で、私のお気に入りの方法は V8 Inspector と vscode です。

vscode で、スパイダー ボタン

をクリックしてデバッグ サイドバーを表示し、構成を追加します。

環境を選択します。

launch.json ファイルを参照してください。 。

開始時に、対応する構成を選択し、右向きの緑色の三角形をクリックします。

起動モードと接続モード

{
  "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
    }
  ]
}

リクエストが起動されると、起動モード はい、これは vscode から起動されるプログラムです。デバッグ中の場合は、常にデバッグ モードになります。アタッチ モードは、すでに開始されているサービスに接続することです。たとえば、外部でプロジェクトを開始していて、突然デバッグが必要になった場合、開始したプロジェクトを閉じて vscode で再起動する必要はなく、アタッチ モードで開始する限り、vscode はすでに開始されているサービスに接続できます。 。デバッグが終了したら、接続を解除するだけです。これは明らかに起動よりも便利です。

npm を使用してデバッグを開始する

package.json のスクリプトに、

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

などの長い起動コマンドと構成を記述することがよくあります。 npm を使用して vscode を起動してデバッグできるようにしたいのですが、それには次の構成が必要です

{
  "name": "Launch via NPM",
  "type": "node",
  "request": "launch",
  "runtimeExecutable": "npm",
  "runtimeArgs": [
    "run-script", "dev"//这里的dev就对应package.json中的scripts中的dev
  ],
    "port": 9229//这个端口是调试的端口,不是项目启动的端口
},

デバッグで開始するにはノードモンを使用します

ノードモンは使用されていますが、開始するには npm を使用してください。 dev コマンドでプログラムを正常に再起動できますが、再起動後はデバッグが切断されます。したがって、vscode で nodemon を使用してプロジェクトを開始できるようにする必要があります。

{
  "type": "node",
  "request": "launch",
  "name": "nodemon",
  "runtimeExecutable": "nodemon",
  "args": ["${workspaceRoot}/bin/www"],
  "restart": true,
  "protocol": "inspector",//相当于--inspect了
  "sourceMaps": true,
  "console": "integratedTerminal",
  "internalConsoleOptions": "neverOpen",
  "runtimeArgs": [//对应nodemon --inspect之后除了启动文件之外的其他配置
    "--exec",
    "babel-node",
    "--presets",
    "env"
  ]
},

ここで runtimeArgs に注目してください。これらの設定を package.json に記述すると次のようになります。

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

これは非常に便利です。プロジェクトは正常に再起動できます。再起動するたびに同様となり、デバッグ機能が有効になります。

しかし、デバッグ機能を常に有効にしたくない場合はどうすればよいでしょうか?

これには、上記の接続モードを使用する必要があります。

次のコマンドを使用して通常にプロジェクトを開始します

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

デバッグする場合は、vscode のデバッグで次の構成を実行します

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

完璧です!

以上がvscode npmの実行方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。