Sp-dev-docs: Debug cannot hit breakpoint

[stone12379]

OS: macOS Mojave 10.14
VS Code: 1.28.2
Chrome: 70.0.3538.77
yo @microsoft/generator-sharepoint: 1.6.0

---

Document Details

⚠ Do not edit this section. It is required for docs.microsoft.com ➟ GitHub issue linking.

• ID: 959a8968-baa1-e94c-10af-a52604aef21e
• Version Independent ID: cecd4be2-5717-d282-587e-7a93910a03a3
• Content: Debug SharePoint Framework solutions in Visual Studio Code
• Content Source: docs/spfx/debug-in-vscode.md
• Product: sharepoint
• GitHub Login: @spdevdocs
• Microsoft Alias: spdevdocs

[Seiyasu]

Please provide your reproducible sample and more other information, such as screenshot. If you run gulp server --nobrowser and then try to use local workbench, you need to run the https://localhost:5432 first.

[stone12379]

Thank for Seiyasu. Actually, I have lanched https://localhost:5432/workbench for the first time to debug. However, I still cannot hit the break point, even when the log shows that the line of code has been executed. Screens in below.

[stone12379]

[Seiyasu]

Due to you use local workbench, you should run gulp serve but not gulp serve --nobrowser. The latter is mainly for hosted workbench but not the local.

You can refer to the related issues:
https://github.com/SharePoint/sp-dev-docs/issues/2772
https://github.com/Microsoft/vscode-react-native/issues/625

[stone12379]

used 'gulp serve' instead but still not working.

[stone12379]

[phillipharding]

I have the same issue
Debugging SPFX Web Part With VS Code Issue

[tsekityam]

Adding statement debugger; as https://github.com/SharePoint/sp-dev-docs/issues/2772#issuecomment-433277028 suggested breaks the code.

However, it breaks the code in a new read-only file, and the break point set in VS Code still don't activated.

With spfx v1.4.1, the break point breaks at the editing file, and after that version, none of the break point set in VS Code breaks. Perhaps spfx v1.5.0 introduced the bug.

[RihardsVla]

I have the same issue, all latest updates are installed.
You can activate breakpoints only after setting the brakepoint on the same line in Chrome as set in vscode . Setting breakpoints in VSCode has no effect. However the debuging actualy happens in VS Code.

[andrewconnell]

Seems something changed in the code generated by the SPFx Yeoman generator and now the hint paths in the launch.json file is not valid.

Add the following path and it should be working:

"webpack:///.././src/*": "${webRoot}/src/*",

[nero120]

Thanks @andrewconnell, that sorted it for me.

[phillipharding]

Brilliant, cheers @andrewconnell that fixed it

[stone12379]

Applause! @andrewconnell

[mike-morr]

@VesaJuvonen can we get the line provided by @andrewconnell to the launch.json? This is still broken in the latest generator.

[andrewconnell]

This was fixed in current SPFx v1.7.1

[msft-github-bot]

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues