7: Deployment of Extension/WebPart to CDN without debug mode

As in point 6 we have configured CDN, now we will upload binaries our extension. If you didn't configure CDN please follow this: CDN Configuration for Extension deployment

7.1: Changes Required in spfx extension code before Deployment

1: Update the CDN path in write-manifests.json

2: Final Change in elements.xml we are making change this file because once our extension deployed we don’t want to pass properties as query string:

Modified Elements.xml as per our extension:

Set properties than these properties will be passed from here no need to pass via query string.

<?xml version="1.0" encoding="utf-8"?>

<Elements xmlns="http://schemas.microsoft.com/sharepoint/">

    <CustomAction

        Title="ModifyOtbApplicationCustomizer"

        Location="ClientSideExtension.ApplicationCustomizer"

        ClientSideComponentId="5b595d7e-c3cd-407f-9ca8-91c3bfe50080"

        ClientSideComponentProperties="{&quot;cssurl&quot;:&quot;/SiteAssets/customcss.css&quot;,

        &quot;Bottom&quot;:&quot;Follow us on:&quot;,

        &quot;Logo&quot;:&quot;/SiteAssets/FooterImages/LinkedIn.png&quot;,

        &quot;testMessage&quot;:&quot;Test message&quot;}">

    </CustomAction>

</Elements>

For your Reference:

3: Run this command: gulp bundle –ship

This command will generate file on this path:

..\Temp -> deploy -> copy these files and paste in CDN folder

4: Upload These files in CDN Library we created during CDN Configuration:

5: Run this Command: gulp package-solution –ship

This command will generate .sppkg

Go to this path ..\sharepoint\solution

Upload this file to: App Catalog (Site Contents -> Apps for SharePoint)
Follow steps defined here: If Apps for SharePoint is Missing: Solution

Next upload your .sppkg to and Click on Deploy

Now go to Add an App

Here you will get your Newly uploaded App just click on this app will install:

Installing app:

After this refresh the page you will see your changes without query string

Hurry your app is running without debug mode:

If SharePoint apps catalog is missing here is a Solution. Follow these steps to

Next Generate SharePoint Apps Library

Thanks Best Of Luck. If you stuck somewhere please feel free to ask in Comment. #SharingIsCaring