Setup Azure Pipeine for SharePoint SPFx

I followed this article https://www.youtube.com/watch?v=8gQFUQzDzSs to setup the Azure pipeline for packaging and deploying SPFx to SharePoint Online. My Repos name contains space between words.

When the pipeline executes the "gulp bundle" step,  there is error message from webpack that unable to find some css resources. I did some research in the Internet and fount out that webpack behaviors different in windows and Linux.

The above video used the linux platform but I work on windows PC to build and package the SPFx.

So once I change the platform to windows with the line of code "vmImage: 'windows-latest'", the "gulp bundle" step passing the CSS error! However, it always shows error "exited with code 1" at the end and caused the pipeline failure.

To resolve this issue, I refer to this https://www.eliostruyf.com/how-to-let-the-warnings-not-fail-the-sharepoint-framework-build-process/ and then added following code to gulpfile.js

// Retrieve the current build config and check if there is a `warnoff` flag set

const crntConfig = build.getConfig();

const warningLevel = crntConfig.args["warnoff"];

// Extend the SPFx build rig, and overwrite the `shouldWarningsFailBuild` property

if (warningLevel) {

  class CustomSPWebBuildRig extends build.SPWebBuildRig {

    setupSharedConfig() {

      build.log("IMPORTANT: Warnings will not fail the build.")

      build.mergeConfig({

        shouldWarningsFailBuild: false

      });

      super.setupSharedConfig();

    }

  }

  build.rig = new CustomSPWebBuildRig();