The view must derive from WebViewPage, or WebViewPage. (The view at '~/Views/home/index.cshtml' must derive from WebViewPage, or WebViewPage.)

I am writing this blog to help you understand the following scenario which you can see sometime while working on the ASP.NET MVC website. You are prone to get this error message if you are using ASP.NET Razor view syntax and specifically

not using the Visual Studio provided template to develop an ASP.NET MVC website or you have removed some files while customizing the template. Let’s try to understand this scenario.

 

The view at '~/Views/home/index.cshtml' must derive from WebViewPage, or WebViewPage<TModel>.

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
Exception Details: System.InvalidOperationException: The view at '~/Views/home/index.cshtml' must derive from WebViewPage, or WebViewPage<TModel>. 

image

 

To easily understand this issue, we need to understand the WebViewPage class first. Here is the MSDN documentation https://msdn.microsoft.com/en-us/library/system.web.mvc.webviewpage(v=vs.118).aspx which says “WebViewPage class represents the properties and methods that are needed in order to render a view that uses ASP.NET Razor syntax.”

 

So since we know that this is required component to get Razor syntax working, we need to find out the solution now. Easiest solution can be #1 given following and which is as per the error message says, view must derive from WebViewPage.

 

Solution 1.

Add following line on top of your cshtml file.

@inherits System.Web.Mvc.WebViewPage

 

You must be wondering now thinking that views in ASP.NET MVC templates do not have this line on top of the cshtml file? So let’s see the second solution.

Solution 2.

Add a web.config file  and specify the same setting for all the views. This  is the minimum required code in this configuration file to get rid of this error message.

 <?xml version="1.0"?>
<configuration>
  <configSections>
    <sectionGroup name="system.web.webPages.razor" type="System.Web.WebPages.Razor.Configuration.RazorWebSectionGroup, 
                  System.Web.WebPages.Razor, Version=2.0.0.0, Culture=neutral,PublicKeyToken=31BF3856AD364E35">
      <section name="host" type="System.Web.WebPages.Razor.Configuration.HostSection, System.Web.WebPages.Razor, 
               Version=2.0.0.0, Culture=neutral,PublicKeyToken=31BF3856AD364E35" requirePermission="false" />
      <section name="pages" type="System.Web.WebPages.Razor.Configuration.RazorPagesSection, System.Web.WebPages.Razor,
               Version=2.0.0.0, Culture=neutral,PublicKeyToken=31BF3856AD364E35" requirePermission="false" />
    </sectionGroup>
  </configSections>
  
  <system.web.webPages.razor>
    <pages pageBaseType="System.Web.Mvc.WebViewPage" ></pages>
  </system.web.webPages.razor>
</configuration>
 

Actual setting required is pageBaseType="System.Web.Mvc.WebViewPage". Other text is only required to define the tags.

 

If you will create an ASP.NET MVC website using the Visual Studio provided default templates, you can see that Views folder already contains this web.config file. However, this file contains a lot of other required configuration as well.

 

image 

Please let me know the feedback or concerns.

Thanks,

Gaurav