Azure application service is missing .css file content

Question

I finally have my Blazor .Net 6 application working as an Azure app service. One last problem I can't figure out, I'm missing css from my project's wwwroot folder. But the font-icons are all there.

when I load the site no css has been applied and there is nothing in the Style Editor window

I'm using Azure DevOps pipeline to deploy the code and I'm fairly certain that's where the problem lies but I haven't found much on SO or general Google searches looking for "Azure app service missing css". Here is my .yaml file

# ASP.NET
# Build and test ASP.NET projects.
# Add steps that publish symbols, save build artifacts, deploy, and more:
# https://docs.microsoft.com/azure/devops/pipelines/apps/aspnet/build-aspnet-4

trigger:
- master

pool:
  vmImage: 'windows-latest'

variables:
  solution: '**/*.sln'
  buildPlatform: 'Any CPU'
  buildConfiguration: 'Release'

steps:
- task: NuGetToolInstaller@1

- task: DotNetCoreCLI@2
  inputs:
    command: 'restore'
    restoreSolution: '**/*.sln'
    feedsToUse: 'config'
    nugetConfigPath: nuget.config

- task: VSBuild@1
  inputs:
    solution: '$(solution)'
    msbuildArgs: '/p:DeployOnBuild=true /p:WebPublishMethod=Package /p:PackageAsSingleFile=true /p:SkipInvalidConfigurations=true /p:PackageLocation="$(build.artifactStagingDirectory)" /p:UseWPP_CopyWebApplication=true  /p:OutDir="$(build.artifactstagingdirectory)"'
    configuration: '$(buildConfiguration)'  

- task: ArchiveFiles@2
  inputs:
    rootFolderOrFile: '$(Build.ArtifactStagingDirectory)'
    includeRootFolder: false
    archiveType: 'zip'
    archiveFile: '$(System.DefaultWorkingDirectory)/deploy.zip'
    replaceExistingArchive: true
    
- task: PublishBuildArtifacts@1
  inputs:
    PathtoPublish: '$(System.DefaultWorkingDirectory)'
    ArtifactName: 'drop'
    publishLocation: 'Container'
    
- task: AzureRmWebAppDeployment@4
  inputs:
    ConnectionType: 'AzureRM'
    azureSubscription: '<sub name>(2442165c-339d-4e83-a443-*******)'
    appType: 'webAppLinux'
    WebAppName: 'hrchangemanagement'
    deployToSlotOrASE: false
    ResourceGroupName: 'HRChangeManagement'
    packageForLinux: '$(System.DefaultWorkingDirectory)/deploy.zip'
    RuntimeStack: 'DOTNETCORE|6.0'
    StartupCommand: 'dotnet "HR Taxonomy Change Management.dll"'

Any suggestions you have are welcomed!

Answer 1

When building Web App, the wwwroot folder will not be automatically copied to the output directory (OutDir) of the build by default. Same behavior when building both in Azure Pipelines and on local machines.

To let the wwwroot folder can be automatically copied to the output directory when building the Web App. You can add below command to the Post-build event of your project file (for example, MyWebApp.csproj).

xcopy .\wwwroot $(OutDir)\wwwroot /s /i

• The .\wwwroot is the relative path of wwwroot folder in the project. Replace it with the actual relative path in your project if it is different than this one.
• The $(OutDir)\wwwroot is the target path that the wwwroot folder will be copied to. You also can change it to a different path based on your actual requirements.

See below example as reference:

• Settings on the project.

  

  

• Result.