Create React App Debugging

launch.json

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8700",
            "webRoot": "${workspaceFolder}/src",
            "preLaunchTask": "npm: start"
        },
        {
            "type": "msedge",
            "request": "launch",
            "name": "Launch Edge against localhost",
            "url": "http://localhost:8700",
            "webRoot": "${workspaceFolder}", 
            "preLaunchTask": "npm: start"           
        }
    ]
}

tasks.json

{
    "version": "2.0.0",
    "tasks": [
       {
          "type": "npm",
          "script": "start",
          "group": {
            "kind": "test",
            "isDefault": true
          },
          "isBackground": true,   // This prevents the launch.json to wait for the completion of the task
          "problemMatcher": {
             "owner": "custom",   // This is not needed but, required by the problemMatcher Object
             "pattern": {
               "regexp": "^$"     // This is not needed but, required by the problemMatcher Object
             },
             "background": {
               "activeOnStart": true,
               "beginsPattern": "Compiling...",  // Signals the begin of the Task
               "endsPattern": "Compiled .*"      // Signals that now the initialization of the task is complete
             }
          }
       }
    ]
}