title: Why am I getting a encoding error with my ASP.NET Core View?
body: <p>I've recently stepped into ASP.NET Core and I'm working through some documentation but one thing has cropped up more than one that I can't find the solution too.  When I run my application I get the following error in the console:    </p>
  
  <blockquote>
    <p>The character encoding of the plain text document was not declared.
    The document will render with garbled text in some browser
    configurations if the document contains characters from outside the
    US-ASCII range. The character encoding of the file needs to be
    declared in the transfer protocol or file needs to use a byte order
    mark as an encoding signature.</p>
  </blockquote>
  
  <p>When I searched on this error I saw messages stating that I should add the base encoding declaration to the document head.  That made sense but didn't work.</p>
  
  <pre><code>&lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;
  </code></pre>
  
  <p>Here is my current setup:</p>
  
  <p><a href="https://i.stack.imgur.com/8G9Rl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8G9Rl.png" alt="Project Setup"></a></p>
  
  <p><strong>HomeController</strong></p>
  
  <pre><code>using Microsoft.AspNetCore.Mvc;
  using Senua.Models;
  using System.Diagnostics;
  
  namespace Senua.Controllers
  {
      public class HomeController : Controller
      {
          public IActionResult Index()
          {
              return View();
          }
          [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
          public IActionResult Error()
          {
              return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
          }
      }
  }
  </code></pre>
  
  <p><strong>Views/Home/Index.cshtml</strong></p>
  
  <pre><code>@{
      ViewData["Title"] = "Index";
  }
  
  &lt;h2&gt;Index&lt;/h2&gt;
  </code></pre>
  
  <p><strong>Views/Shared/Layout</strong> </p>
  
  <p>I've shortened this for brevity.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
      &lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;
      &lt;title&gt;@ViewData["Title"] - WebApplication1&lt;/title&gt;
  
      &lt;environment include="Development"&gt;
          &lt;link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" /&gt;
          &lt;link rel="stylesheet" href="~/css/site.css" /&gt;
      &lt;/environment&gt;
      &lt;environment exclude="Development"&gt;
          &lt;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" /&gt;
          &lt;link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" /&gt;
      &lt;/environment&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;partial name="_CookieConsentPartial" /&gt;
      &lt;div class="container body-content"&gt;
          @RenderBody()
      &lt;/div&gt;
  
      &lt;environment include="Development"&gt;
          &lt;script src="~/lib/jquery/dist/jquery.js"&gt;&lt;/script&gt;
          &lt;script src="~/lib/bootstrap/dist/js/bootstrap.js"&gt;&lt;/script&gt;
          &lt;script src="~/js/site.js" asp-append-version="true"&gt;&lt;/script&gt;
      &lt;/environment&gt;
      &lt;environment exclude="Development"&gt;
          &lt;script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"
                  asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                  asp-fallback-test="window.jQuery"
                  crossorigin="anonymous"
                  integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT"&gt;
          &lt;/script&gt;
          &lt;script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"
                  asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
                  asp-fallback-test="window.jQuery &amp;&amp; window.jQuery.fn &amp;&amp; window.jQuery.fn.modal"
                  crossorigin="anonymous"
                  integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"&gt;
          &lt;/script&gt;
          &lt;script src="~/js/site.min.js" asp-append-version="true"&gt;&lt;/script&gt;
      &lt;/environment&gt;
  
      @RenderSection("Scripts", required: false)
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Views/ViewStart.cshtml</strong></p>
  
  <pre><code>@{
      Layout = "_Layout";
  }
  </code></pre>
  
  <p><strong>Views/ViewIMports.cshtml</strong></p>
  
  <pre><code>@using Senua
  @using Senua.Models
  @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
  </code></pre>
  
  <p><strong>Startup.cs</strong></p>
  
  <pre><code>using Microsoft.AspNetCore.Builder;
  using Microsoft.AspNetCore.Hosting;
  using Microsoft.AspNetCore.Mvc;
  using Microsoft.EntityFrameworkCore;
  using Microsoft.Extensions.Configuration;
  using Microsoft.Extensions.DependencyInjection;
  using Senua.DAL;
  
  namespace Senua
  {
      public class Startup
      {
          public Startup(IConfiguration configuration)
          {
              Configuration = configuration;
          }
  
          public IConfiguration Configuration { get; }
  
          // This method gets called by the runtime. Use this method to add services to the container.
          public void ConfigureServices(IServiceCollection services)
          {
              services.AddDbContext&lt;LocalContext&gt;(opt =&gt; opt.UseSqlServer(Configuration.GetConnectionString("Melina")));
              services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
          }
  
          // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
          public void Configure(IApplicationBuilder app, IHostingEnvironment env)
          {
              if (env.IsDevelopment())
              {
                  app.UseDeveloperExceptionPage();
              }
              else
              {
                  app.UseExceptionHandler("/Home/Error");
                  app.UseHsts();
              }
  
              app.UseHttpsRedirection();
              app.UseMvc();
          }
      }
  }
  </code></pre>
  
  <p>So that's the setup in a nutshell.  As far as I can see the ViewStart defines layout which should deliver the document setup and then renderbody is in place to delivery content from the homepage.  Home has it's controller and method to return the view.  What am I missing?  </p>
  
  <p>Many thanks</p>