- Launch the console window and set console path to our SPFx web part directory. If Yeoman server is running on a console you have to stop it by Ctrl+C command followed by Y.
- gulp clean command: This command clean the project deployment file .sppkg which is present in folder sharepoint under project directory and also creates debug solution file.
- gulp bundle –ship command: This command help to create minified files for build the solution and also generate debug bundle under dest folder. This builds the minified assets required to upload to the CDN provider. The minified assets can be found under the temp\deploy directory.
- gulp package-solution –ship command: This creates the updated client-side solution package in the sharepoint\solution folder. Created file: sharepoint\solution\ms-hello-world.sppkg
- Now upload or drag an drop solution package file from sharepoint\solution\ms-hello-world.sppkg to App for sharePoint library in app catalog site.
- Once our SPFx web part package has finished uploading, we will be prompted with a dialog window to complete the deployment. This is where you will choose whether to deploy to all sites within your tenant or to all subsites within your site collection. Make your selection and then click the Deploy button.
- We have deploy our Hello World SPFx web part. Now we need to add it on modern SharePoint site page.
- From + Add a new web part icon we select our WP Hello World web part and save it.
Note: In case we did not select “Make this solution available to all sites in the organization”, we would first have to add SPFx web part to respective site and then we add on page.
On SPFx web part creation SharePoint Youmen Generator will ask “if you would like to allow the tenant admin the ability to deploy the solution to all sites.” If we say Y yes then skipFeatureDeployment property set to true in the package-solution.json file. We also manually set this property from package-solution.json file.
No comments:
Post a Comment