SharePoint Framework Deployment error: failed to load URL from CDN

Question

Background:

• I occasionally have all instances of a webpart fail after deploying a change.
• The webpart was recently built using the latest SharePoint framework.
• The gulp trust-dev-cert command was run.
• I can view the files in the CDN and they are there. Note: to view use SharePoint Designer to open the AppCatalog site, browse files, and locate the hidden library "ClientSideAssets".
• This does not have to do with enabling the CDN using PowerShell, that has been working just fine for a while.
• This webpart deploys to a modern SharePoint site on SharePoint Online.

Steps:

1. Make a change to SCSS or Typescript in the solution.
2. Increment the version number in package-solution.json
3. Run: gulp bundle --ship
4. Run: gulp package-solution --ship
5. Copy the app package to the AppCatalog
6. Click deploy.
7. Observe the following error occur everywhere this webpart exists in all site collections:

Note: I edited the URL below to remove the company name

[SPLoaderError.loadComponentError]: ***Failed to load component "2f577b52-24dd-4e0a-9bb6-0c981e7521f5" (KoBrowserWebPart). Original error: ***Failed to load URL 'https://publiccdn.sharepointonline.com/companyname.sharepoint.com/sites/appcatalog/ClientSideAssets/af56530a-5e0a-4028-a34f-5fb72306de9a/ko-browser-web-part_c6d61901d4a2d4242e09f64d3838dd3a.js' for resource 'ko-browser-web-part' in component '2f577b52-24dd-4e0a-9bb6-0c981e7521f5' (KoBrowserWebPart). There was an error requesting the file.

Questions:

• Can we depend on Microsoft to give us a deployment model to SharePoint Online we can trust?
• Should I be doing something else to ensure a change doesn't break in all environments during deployment?
• Has anyone noticed that the files uploaded to the CDN increment in count every time you package the solution? The size of the app package also increases in disk space each time. Why is Microsoft (or gulp) including all versions of the js file in the deployment?
• List item

Answer 1

I have changed my deployment steps:

1. gulp clean --ship
2. gulp build --ship
3. gulp bundle --ship
4. gulp package-solution --ship

This has resolved the excessive number of js files in the /temp/deploy folder and the size of the sppkg file. I also have not experienced the issues with the CDN while using this approach.

Answer 2

I'm not using CDN. I was getting: Failed to load URL...The file was not found in the server. Your deployment steps fixed this issue for me. I'll be adding clean --ship & build --ship every deployment going forward, thanks!