Skip to content

Instantly share code, notes, and snippets.

@pcostarg

pcostarg/launch.json

Last active November 13, 2024 03:26
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save pcostarg/cb578d869ef0cfc96608306b0e6a407e to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save pcostarg/cb578d869ef0cfc96608306b0e6a407e to your computer and use it in GitHub Desktop.
Download ZIP
Vivaldi/Chrome/Edge - Remote debugging in VS Code with SPO/SPFx examples
Raw
readme.md

Vivaldi/Chrome/Edge - Remote debugging in VS Code with SPO/SPFx examples

Change url for whataver you want if using different then default. This is the url it will open automaticly

Notes for attach

  • Create a new shortcut for Vivaldi and in the target add this flags: --remote-debugging-port=9222 --user-data-dir=remote-debug-profile
  • Use this shortcut to open the browser and use it
  • url property makes it only listen to the tab using this url, default is to listen in all tabs.

Update

Added multiple configurations for edge, chrome and Vivaldi.

SPO configurations are for SPFx apps. Don't forget to replace the url placeholders. If using a different port, don't forget to change the debug querystring accordingly. If using react-router you can have the router as a #/path/sub-path/... , using HashRouter component. BrowserRouter does not work with SPO. Eg. ?debug=true&noredir=true&debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js#/process/expenses

Raw
launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Attach to Chrome/Vivaldi",
"port": 9222,
"request": "attach",
"type": "chrome",
"url": "http://localhost:8080"
},
{
"type": "chrome",
"request": "launch",
"runtimeExecutable": "${env:LocalAppData}/Vivaldi/Application/vivaldi.exe",
"name": "Launch Vivaldi",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}",
},
{
"name": "SPO Hosted workbench - Edge",
"type": "msedge",
"request": "launch",
"url": "{SPO-SITECOLLECTION-URL}/_layouts/workbench.aspx",
"webRoot": "${workspaceRoot}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:///.././src/*": "${webRoot}/src/*",
"webpack:///../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../../src/*": "${webRoot}/src/*"
},
"runtimeArgs": [
"--remote-debugging-port=9222",
"-incognito"
]
},
{
"name": "SPO Site - Chrome",
"type": "chrome",
"request": "launch",
"url": "{SPO-PAGE-URL}?debug=true&noredir=true&debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js",
"webRoot": "${workspaceRoot}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:///.././src/*": "${webRoot}/src/*",
"webpack:///../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../../src/*": "${webRoot}/src/*"
},
"runtimeArgs": [
"--remote-debugging-port=9222",
// "-incognito"
]
},
{
"name": "SPO Site - Vivaldi",
"type": "chrome",
"request": "launch",
"url": "{SPO-PAGE-URL}?debug=true&noredir=true&debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js",
"webRoot": "${workspaceRoot}",
"runtimeExecutable": "${env:LocalAppData}/Vivaldi/Application/vivaldi.exe",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:///.././src/*": "${webRoot}/src/*",
"webpack:///../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../../src/*": "${webRoot}/src/*"
},
"runtimeArgs": [
"--remote-debugging-port=9222",
// "-incognito"
]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment