SPFx web part cdnBasePath: possible to use server relative URL to make switching between environments easy?

Question

Scenario:

SP 2016 on-premises. We have set up a centralized App Catalog site, and have settled on the solution of using a document library called "AppFiles" on the App Catalog site as our "CDN" to host the JS files. We have a Dev farm and a Prod farm.

Problem:

I'm trying to set up a site to turn into a site template, so we can eventually create new sites with a number of lists, site pages and web parts pre-installed. Since this is development work, I'm doing it in the Dev environment. But I realized that the SPFx web part I'm installing on the site in the Dev environment has a cdnBasePath of

https://dev-server/sites/apps/AppFiles/MyWebpartFolder

Now, I'm guessing that if I save the site as a template, that CDN URL is going to be stored somewhere in the template, and if we then create a site in Prod based on the template the web part will not load because the CDN URL is on a different server/web application. Or, even if it does work somehow, then it will be pulling the code from the Dev environment, which may at some point be in development as updates are added, which would mean dev code would be being pulled over to the Prod environment.

So, is it possible to use a server relative URL like

/sites/apps/AppFiles/MyWebpartFolder

as the cdnBasePath? That way the web part will try to pull it's JS files from the local environment's App Catalog site, be that in https://dev-server or https://prod-server.

Or am I going to have to package the web part with a cdnBasePath URL in Prod, deploy the web part to the Prod App Catalog, and build my template site in Prod?

Answer 1

Thriggle's answer is a pretty clever solution, so I upvoted it, but I had forgotten to come back and answer the question based on my own experiments.

And the answer is: yes.

I packaged up a web part with the CDN base path as the server relative URL

/sites/apps/AppFiles/MyWebPartFolder

and set up the App Catalog sites in Prod and Dev to be /sites/apps with the same AppFiles library, deployed the web part to both Dev and Prod, and it worked just fine transitioning between environments.

Answer 2

Here's a possible solution:

Use the library on the Prod app catalog for your cdnBasePath, but use subfolders in the library to distinguish between different versions of your web part. For example, https://prod-server/sites/apps/AppFiles/MyWebPartFolder/1 and https://prod-server/sites/apps/AppFiles/MyWebPartFolder/2

When you start developing a new version of the web part, update your cdnBasePath to point to the next folder. Upload your files from /temp/deploy to the new numbered folder in prod, but deploy your .sppkg package from /sharepoint/solution to your Dev app catalog (not prod).

At this point, the source files for both the old version and the new version will be hosted in your prod library, in different folders. But the prod web part will be pulling from the old version and the dev web part will pull from the new version.

When it's time to deploy to prod, just deploy the .sppkg to the Prod app catalog.