3

Your web part will not appear in the toolbox. Please make sure "gulp serve" is running in a web part project. Please refresh the page once "gulp serve" is running.

enter image description here

4
  • Where are you seeing this message? On SharePoint workbench while debugging the solution or on SharePoint page after web part deployment? Commented Nov 23, 2021 at 15:28
  • I'm seeing this message On SharePoint workbench while debugging. Commented Nov 23, 2021 at 15:37
  • Is gulp serve running correctly? check if there are any errors in command prompt console. Commented Nov 23, 2021 at 15:38
  • [spfx-serve] To load your scripts, use this query string: ?debug=true&noredir=true&debugManifestsFile=localhost:4321/temp/manifests.js showing in the command prompt console. Commented Nov 23, 2021 at 16:05

1 Answer 1

1

@ariyan,

When you run gulp serve, you get a lot of messages on the screen, which may be confusing. Especially when there's one that says something like Opening https://enter-your-SharePoint-site/_layouts/workbench.aspx using the default OS app which -- every time -- makes me go "Oh, the web part must be ready!"... but it isn't... yet.

The trick is to wait for Finished subtask'reload'after x.xx ms. Only then will the web part be ready, and you should be able to reload the workbench page and find your web part.

If that doesn't work, you may want to make sure that you installed the self-signed developer certificate by using gulp trust-dev-cert and accepting the prompt (which may sometimes appear in a background window).

If you're using sample code (or code that you didn't build yourself) and you're still experiencing issues, you may want to make sure that the environment you're using is compatible with your SPFx solution by using the Microsoft 365 SPFx Doctor command, by running m365 spfx doctor from the root of the project folder after you installed the CLI for Microsoft 365.

If all else fails, please provide us more information so we can help you better.

I hope this helps?

2
  • I have tried all of these options, and it is still not working for me. I wait until the reload task completes, but then refresh the page and the error is still there. gulp trust-dev-cert completes successfully m365 spfx doctor runs. It finds yo version 3.3.1 and recommends installing version 4; however, when I run npm list -g --depth=0, it shows that I have version 4 installed. Any ideas? Commented Dec 9, 2022 at 22:04
  • 1
    Update: Now I feel dumb, but I will comment in case it helps someone. I was using brave browser with "Shields Up" -- it was blocking something that was required for this to work correctly. I turned off the "Shields Up" option, and it works well. Commented Dec 9, 2022 at 22:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.