自动启动NPM在Visual Studio代码中调试React App时
当我希望在Visual Studio代码中调试我的React应用程序时，我必须打开VS代码的终端，然后键入：
npm start
然后单击运行菜单并“开始调试”。
有什么方法可以一口气将NPM启动和浏览器启动组合起来？
理想情况下，我想点击运行|开始调试，如果NPM尚未启动，则VS代码将执行npm Start。 NPM启动后，以Localhost：3000作为开始页面启动Edge，并将调试器附加。
我的启动> json is：
{
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "pwa-msedge",
"request": "launch",
"name": "Launch Edge against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
和package.json的脚本部分是：
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"build:integration": "env-cmd -f .env.integration npm run build",
"build:uat": "env-cmd -f .env.uat npm run build",
"build:preProd": "env-cmd -f .env.preProd npm run build",
"build:production": "env-cmd -f .env.production npm run build",
"test": "react-scripts test",
"test:ci": "react-scripts test --watchAll=false --testPathIgnorePatterns=src/tests/App.test.js",
"eject": "react-scripts eject"
},
When I wish to debug my React application in Visual Studio Code, I have to open VS Code's terminal and then type:
npm start
Then click the Run menu and "Start debugging".
Is there any way I can combine the npm start and browser launch in one go?
Ideally I'd like to hit Run | Start Debugging and, if NPM hasn't started, VS Code will execute npm start. Once npm is started, launch Edge with localhost:3000 as the start page and attach the debugger.
My launch.json is:
{
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "pwa-msedge",
"request": "launch",
"name": "Launch Edge against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
And the scripts part of package.json is:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"build:integration": "env-cmd -f .env.integration npm run build",
"build:uat": "env-cmd -f .env.uat npm run build",
"build:preProd": "env-cmd -f .env.preProd npm run build",
"build:production": "env-cmd -f .env.production npm run build",
"test": "react-scripts test",
"test:ci": "react-scripts test --watchAll=false --testPathIgnorePatterns=src/tests/App.test.js",
"eject": "react-scripts eject"
},
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以添加
“ prelaunchtask”：“ npm：start”在您的lainage.json中。但是必须在下一次调试之前手动终止此过程You can add
"preLaunchTask": "npm: start"in your launch.json. But have to terminate this process manually before next debug run