1

I created a simple SPFx web part, bundled and created the solution package using the following commands.

gulp clean

gulp bundle --ship

gulp package-solution --ship

Then uploaded the .sppkg to my app catalog (https://.sharepoint.com/sites/apps). But after uploading the .sppkg file it doesn't seem to get deployed and the "Deploy" button stays enabled. When the "Deploy" button is clicked, I get the deploy confirmation dialog but the deploy button says enabled - seems like the deployment didn't happen successfully. When I try add the app from another site's Site Contents, the app doesn't even show up.

Toolchain and versions:

node: 16.18.0

npm: 8.19.2

gulp: 2.3.0 (CLI), 4.0.2 (Local)

@microsoft/generator-sharepoint: 8.19.2

enter image description here

enter image description here

enter image description here

Improve this question
2
  • 1
    I think app is already published. If you have used tenant level deployment, can you go to SP page directly, edit the page and try adding web part on page. Let me know if it works.
    – Ganesh Sanap - MVP
    Commented Nov 2, 2022 at 3:35
  • Yes, I realized it was a tenant level deployment and directly adding the web part on a modern page worked but not on a classic page. And also, on the modern page the web part showed up within the gallery only after a while.
    – juzz_dooit
    Commented Nov 2, 2022 at 18:06

2 Answers 2

Reset to default
1

From the screenshots you attached with your question, your SPFx solution is already deployed successfully:

enter image description here

Also, from your 2nd screenshot, it seems that you are using tenant wide deployment and not site collection specific deployment:

enter image description here

As you are using tenant wide deployment, your web part will be available to use in all site collections in your tenant automatically. In this case, you don't have to add the SPFx solution to individual sites from Site Contents manually.

You can directly add & use this web part on site pages like any other out of the box or SPFx web parts:

  1. Go to SharePoint site page
  2. Edit the page using "Edit" option at top right corner
  3. Click on circled + to add web part
  4. Search your web part and add it to the page.

Follow detailed steps at: Using web parts on SharePoint pages

Related Microsoft documentations:

  1. Tenant-scoped solution deployment for SharePoint Framework solutions
  2. Use the site collection app catalog - This can be used only when you want to deploy the solution for specific site collection only.
Improve this answer
3
  • 1
    Thank you Ganesh, yes I did not have to add the app to site contents and the web part was already part of the gallery.
    – juzz_dooit
    Commented Nov 2, 2022 at 18:11
  • Thank you @Ganesh, I just accepted it as an answer for the tenant-wide deployment scenario. But when I tried without tenant-wide deployment (skipFeatureDeployment: false), the app is supposed to show-up when you go to Setting -> Add an App, right? But I still don't see the app to be able to add into Site Contents. I have feeling the tenant app catalog is corrupted or something.
    – juzz_dooit
    Commented Nov 3, 2022 at 15:10
  • Can you please ask a new question for this issue if possible by providing all the steps you followed and problems you are facing? Did you redeploy the same app or is this issue for another app? Is site collection app catalog enabled for the site where you are trying to add an app?
    – Ganesh Sanap - MVP
    Commented Nov 3, 2022 at 15:31
0

Something that might help to confirm if the package has been deployed would be to go to your client side assets folder in the app catalog and see if there is a folder with your solution id as the folder name. Inside that all the bundled js files should exist.

eg https://[tenant].sharepoint.com/sites/apps/ClientSideAssets/[solutionid]

Also as Ganesh mentioned, with tenant-wide deployment you can just try adding the web part without installing the app to a specific site.

Improve this answer
1
  • Thank you Paul, yes adding the web part directly on the page worked. I had chosen to use my own o365 cdn (includeClientSideAssets: false) and that worked fine also.
    – juzz_dooit
    Commented Nov 2, 2022 at 18:08

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.