Asp.net core 2.1 Web App not rendering correctly on IIS

Question

Time for the big launch! Well not until IIS starts playing nice. A Co-Worker & I spent over 6 hours trying to publish an ASP.NET Core 2.1 Web App to an internal IIS server. After many rounds of error codes and tweaking, we were able to get the app somewhat hosted on IIS, but with one big problem, the rendering was a bit off. Words can't explain how it looks.

What it looks like This is what is being rendered. One thing I noticed, is that when you do a ctrl-u on the page, the pages code is all there.

This is how it should look: https://i.stack.imgur.com/dv6xN.png

Please if anyone has any idea what is going on, any help would be appreciated!

Answer 1

It was an easy fix, and simply an error on my part! Hopefully this helps all future Asp.net core developers when they're ready to publish. From further investigation it was clear the web app was being executed, and was just a matter of rendering improperly. It was clear bootstrap wasn't being hit, which was causing all of the rendering errors.

Within the Asp.net core boilerplate code, the _Layout.cshtml page includes all links and scripts within an environment tag as shown below:

    <environment include="Development">
      <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
      <link rel="stylesheet" href="~/css/site.css" />
    </environment>
    <environment exclude="Development">
      <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
      <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
    </environment>

Simply removing these environment tags allowed for the proper links & scripts to be hit, and now everything is rendering properly.

Answer 2

It's a little challenging to determine the issue here without seeing your source code, but it's possibly that you're simply displaying your nav bar and it's expanding to fit the whole screen, thus distorting the order of icons as well. Make sure it's your whole application running on IIS.