skip to Main Content

I have a simple github actions deployments:

    build:
      ..
      runs-on: ubuntu-latest
      steps:
        - uses: actions/checkout@v4

        - name: Set up .NET Core
          uses: actions/setup-dotnet@v4
          with:
            dotnet-version: ${{ env.DOTNET_VERSION }}

        - name: Build with dotnet
          working-directory: ./${{ matrix.value }}
          run: dotnet build --configuration Release

        - name: dotnet publish
          working-directory: ./${{ matrix.value }}
          run: dotnet publish -c Release -o ${{env.DOTNET_ROOT}}/${{ matrix.value }}/${{ env.APP_NAME }}

        - name: Upload artifact for deployment job
          uses: actions/upload-artifact@v3
          with:
            name: .net-ui
            path: ${{env.DOTNET_ROOT}}/${{ matrix.value }}/${{ env.APP_NAME }}

when in the next job I’m going to deploy these changes via:

  - name: Deploy to Azure Web App
    id: deploy-to-webapp
    uses: azure/webapps-deploy@v2
    with:
      app-name: ${{ env.AZURE_APP_NAME }}
      package: ${{ env.AZURE_APP_PACKAGE_PATH }}

UPDATE: I just noticed that wwwroot folder with css and js files are copied to azure. My server side files placed in the C:homesitewwwroot:

C:homesitewwwroot>ls
Humanizer.dll
Microsoft.AspNetCore.Razor.Language.dll
Microsoft.Bcl.AsyncInterfaces.dll
..
web.config
wwwroot

and inner wwwroot folder is:

C:homesitewwwrootwwwroot>ls     # pay attention on doubled `wwwroot`
UI.styles.css
css
favicon.ico
js
lib

however lib folder doesn’t have all files:

C:homesitewwwrootwwwrootlib>ls    
bootstrap
jquery
jquery-validation
jquery-validation-unobtrusive

where locally I have also microsoft folder with signalr dependencies (dependency files themself are not under git though, but microsoft folder is under the git => all this behavior is default though). I assume I need to restore this somehow.

Another strange part is that some files presented locally (/lib/jquery/dist/jquery.min.js), are not copied on the azure server even though the folder where they are placed has been copied:

C:homesitewwwrootwwwrootlibjquery>ls
LICENSE.txt     # pay attention no "dist" folder

Given the above, these files are not visible in the browser and gives this error:

    GET https://azureapp.eastus-01.azurewebsites.net/lib/jquery/dist/jquery.min.js
    [HTTP/1.1 404 Not Found 351ms

How can I fix handling static files (css/js)? Any help would be appreciated.

2

Answers


  1. Check .csproj File. below line shoud be included

    <ItemGroup>
      <Content Include="wwwroot***.*" CopyToOutputDirectory="PreserveNewest" />
    </ItemGroup>
    

    GitHub Actions workflow uses the correct dotnet publish command

    - name: dotnet publish
      working-directory: ./${{ matrix.value }}
      run: dotnet publish -c Release -o ./publish
    

    update your .csproj file look somewhat like this

    <Project Sdk="Microsoft.NET.Sdk.Web">
    
      <PropertyGroup>
        <TargetFramework>net6.0</TargetFramework> 
        <EnableDefaultContentItems>false</EnableDefaultContentItems>
        <EnableScopedCss>false</EnableScopedCss>
      </PropertyGroup>
    
      <ItemGroup>
        <Content Include="wwwroot***" CopyToOutputDirectory="PreserveNewest" />
      </ItemGroup>
    
      <ItemGroup>
        <PackageReference Include="Microsoft.AspNetCore.Mvc" Version="2.2.0" />
      </ItemGroup>
    
    </Project>
    
    Login or Signup to reply.
  2. The issue is with your yml file dotnet publish step.

    My dotnet publish looks like below:

    - name: dotnet publish
    run: dotnet publish -c Release -o ${{env.DOTNET_ROOT}}/myapp
    
    • All the static files which are under wwwroot local folder are handled with the dotnet publish and included by default in the deployed folder.

    • My .csproj looks simple and is default.

    <Project Sdk="Microsoft.NET.Sdk.Web">
      <PropertyGroup>
        <TargetFramework>net8.0</TargetFramework>
        <Nullable>enable</Nullable>
        <ImplicitUsings>enable</ImplicitUsings>
      </PropertyGroup>
    </Project>
    
    • Push the root folder (where you have Controllers) of the application to GitHub .

    enter image description here

    My complete Workflow file:

    name: Build and deploy ASP.Net Core app to Azure Web App - CoreMVC20Sep
    
    on:
      push:
        branches:
          - main
      workflow_dispatch:
    
    jobs:
      build:
        runs-on: ubuntu-latest
    
        steps:
          - uses: actions/checkout@v4
    
          - name: Set up .NET Core
            uses: actions/setup-dotnet@v4
            with:
              dotnet-version: '8.x'
    
          - name: Build with dotnet
            run: dotnet build --configuration Release
    
          - name: dotnet publish
            run: dotnet publish -c Release -o ${{env.DOTNET_ROOT}}/myapp
    
          - name: Upload artifact for deployment job
            uses: actions/upload-artifact@v4
            with:
              name: .net-app
              path: ${{env.DOTNET_ROOT}}/myapp
    
      deploy:
        runs-on: ubuntu-latest
        needs: build
        environment:
          name: 'Production'
          url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
        permissions:
          id-token: write 
    
        steps:
          - name: Download artifact from build job
            uses: actions/download-artifact@v4
            with:
              name: .net-app
          
          - name: Login to Azure
            uses: azure/login@v2
            with:
              client-id: ${{ secrets.AZUREAPPSERVICE_CLIENTID_********** }}
              tenant-id: ${{ secrets.AZUREAPPSERVICE_TENANTID_********** }}
              subscription-id: ${{ secrets.AZUREAPPSERVICE_SUBSCRIPTIONID_********** }}
    
          - name: Deploy to Azure Web App
            id: deploy-to-webapp
            uses: azure/webapps-deploy@v3
            with:
              app-name: 'CoreMVC20Sep'
              slot-name: 'Production'
              package: .          
    
    • I am able to see the dist folder when I run dotnet publish command in local as well.

    enter image description here

    Deployment:

    enter image description here

    Able to access the files which are under site/wwwroot/wwwroot/lib/jquery/dist folder.

    enter image description here

    How can I fix handling static files (css/js)?

    Check this MSDoc to access any static files from a specific folder.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search