Deploying client side JS applications (e.g. Ember, Vue, React) to Azure App Services - via CI

I have a general question about deploying client apps to Azure App Services. This applies to the Ember, Vue, React apps I've recently tried.

Azure allows App Services to be integrated with Github etc and enables a deployment to the App Service triggered by any push to a branch.

This is great but the general assumption by Azure is that deployment consists of syncing the /wwwroot folder with your entire repository. Aside from the additional files synced, 90% of the time the client side frameworks have their own build tooling and expect to run this and publish their contents to a dist folder or similar.

So my question is, What is the best practice to integrate such a repository with an Azure App service?

At the moment I'm looking at one of several approaches:

1. Create a custom deployment process for Kudu which runs the same build steps as I would locally, clears the wwwroot and takes the contents of the dist folder and puts them in the wwwroot
2. Ditch the Git integration directly and use TFS build steps to run npm build and xcopy or similar the files to their desired locations.
3. Build and test locally and create a second git repo mapping to the dist folder and trigger builds from pushes to this :(
4. Ditch the CI for deployment and just use the integration for testing and FTP the build results :(

None of these approaches seem great, but I'm seeing the same problems every time I try to setup CI on client side libraries and loosing a lot of time to this.

If anyone has any thoughts or better approaches I'm all ears!