From the course: SharePoint Framework for Developers: 2 Authoring and Debugging Solutions

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Debug SPFx solutions in the browser

Debug SPFx solutions in the browser

From the course: SharePoint Framework for Developers: 2 Authoring and Debugging Solutions

Start my 1-month free trial

Debug SPFx solutions in the browser

“

- With our SPFX Web part solution written, I just showed you how you can debug this code directly inside of VS Code. Valuable, but I think there's a better approach. So let's go back to Cmder, or whichever terminal you're using, and just type gulp serve. When you type gulp serve again, it'll build a project, it'll run the local web server. And it will pop open the browser, and our solution loads up, let's go ahead and drop the web part. But actually this time, I'm going to hit F12, or Command + Shift + I on a Mac to reveal the dev tools. Let's go ahead and drop the web part. The web part loads as expected. I'm working in very low resolution, so I'll try doing my best job on this. Let's go to Sources, and now, let's press Control + P. Now when I press Control + P, it pops open this user interface, and here I can simply type the name of the file that I'm interested in debugging. Go ahead and select it, come down this align 19, and we're going to make this a little bit smaller. Hit…

Contents