Techrobbers

In this article, we are going to see the ways in which we can test, and debug SPFx solutions on Modern Pages on SharePoint Sites. There are several ways to debug the SPFx client-side solutions with SharePoint Modern Pages. Why it's beneficial to test web parts on modern pages? It's easy to test web parts on the local workbench and it's a very time-saving approach. But in some cases, when you are developing web parts that interact with the content of the SharePoint site or you are using the SharePoint APIs local workbench will not work, because we need access to get data using SharePoint APIs that we will not get on local workbench.  Test SharePoint Framework web parts on Modern Pages in SharePoint sites without deploying to your app catalog site. Test your SPFx client-side solution (web part or extension) on the SharePoint Modern pages by loading the debug scripts.   Follow the steps: 1. Run the command (gulp serve –nobrowser ) 2. Go to the SharePoint site and n avigate t...

In this article, we are going to learn about some common error we faced while developing and deploying the SPFx solution. There are several mistakes we make while working with the exsisting code, I will be sharing the solution to get rid from those errors. Error 1 : When you create a solution and run with the gulp everything seems fine but when you deploy the package to app catalog you see these errors : Component ID {0} exists in solution {1} already   or  Component ID {0} exists in solution {1} already. And having some correlation ID or  A solution with the same product ID already exists.  Please upload the file with the same name and replace the existing solution Solution:  This error stated that you are using the solution with same id which is already deployed at your app catalog. You can change the   Do the steps mentioned below: 1. Go to your solution, Under Config move to package-solution.json file and change the id. You need to replace the GUID...

In this article, we are going to discuss some common things which we need to update in SharePoint Framework(SPFx) solution. How to chage the SharePoint Framework Solution name?? SharePoint solution name we set while creating the solution but some time we need to chang it. In order to change the SharePoint Framework solution name, we need to edit the package - solution.json file, change the name under the solution. It will change the name and new name will also appear on title in SharePoint appcatalog when you deploy the package. How to chage the SharePoint Framework package name?? If you want to change the name of sppkg package created using SPFx, you need to edit the package-solution.json file.   Upadate zippedpackage under the paths. Only the name after '/ ' should be updated. How to chage the webpart name in SharePoint Framework Solution?? You can change the name of your webpart from the webpart.manifest.json file present in the solution. Change the value of default in tit...

In this blog, we are going to learn all the commands which are very useful in developing SharePoint Framework client side solutions. These commands are useful in both web parts and extensions development using SPFx Framework. You can install node modules and use them in SharePoint Framework and either you can use things from CDN also. Clean and build the SharePoint Framework (SPFx) client side solution. gulp clean gulp build Create app package of SharePoint Framework (SPFx) client side solution. gulp bundle --ship gulp package-solution --ship Install Jquery in  SharePoint Framework (SPFx) client side solution. npm install jquery --save npm install @types/jquery --save-dev Install bootstrap in  SharePoint Framework (SPFx) client side solution. npm install bootstrap --save npm install @types/bootstrap  --save-dev Install bootstrap with a specific version in  SharePoint Framework (SPFx) client side solution. npm install bootstrap@4 --save npm install @types/bootstrap@4 ...