Search code examples
c#asp.netrazorcomponentsblazor

Component tag does not render blazor component when the razor page is not directly in the pages folder


I an trying to render a blazor component in a razor page. My project is ASP.NET Core Web App. I am primarily using razor pages. I have been successful rendering a blazor component when the razor page is in the Pages folder such as in the Privacy page, but when I added a razor page to a subfolder in the Pages folder, it does not work anymore.

I have been following this link. It works. Just not when the razor page is in a folder within the Pages folder. Using Blazor Components In An Existing MVC Application

This is my cshtml code.

<component type="typeof(HelloWorld.Pages.Components.Counter)" render-mode="Server" />

Solution

  • Instead of adding the blazor script on each page, I added two things in the _Layout.cshtml page.

    In the head tag

    <base href="~/" /> 
    <component type="typeof(HeadOutlet)" render-mode="Server" />
    

    Below the footer tag

    <script src="_framework/blazor.server.js"></script>