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"
},