ViewComponents in Areas

When using your component you should be able to use absolute path to your view like this View("~/Areas/Test/Views/Components/Hello/Default.cshtml") to fix your problem.


The Area attribute can only be used with controllers. When you make a request to a view within an area and if this view has any view components referenced in them, then MVC looks for the view component's views in certain order.
Following is the difference in how a view component view is searched when a request matches an area based controller vs. a non-area controller.

Example:

  1. View Component's view search path for a request like /Admin/Home/Index where Admin is an area.

    • /Areas/Admin/Views/Home/Components/Products/Default.cshtml
    • /Areas/Admin/Views/Shared/Components/Products/Default.cshtml
    • /Views/Shared/Components/Products/Default.cshtml.
  2. View Component's view search path for a request like /Home/Index (non-area request)

    • /Views/Home/Components/Products/Default.cshtml
    • /Views/Shared/Components/Products/Default.cshtml.

The ViewComponents files should be placed as below:

ViewComponent in MVC Area

Then invoke from the View:

@await Component.InvokeAsync(typeof(Swastika.Web.Start.Areas.Portal.ViewComponents.MainSidebar));

This works for me. I hope it helps!