View components in Razor Pages

[ifo20]

I'm confused with this instruction: "Create the Views/Shared/Components folder. This folder must be named Components."
I am using Razor Pages rather than MVC. I don't have a Views folder or a Shared folder (infact the Razor intro says I shouldn't have a Views/Shared folder).

In my basic app I currently have, at the root level, a Pages folder, and a ViewComponents folder.
Should I create this 'Components' folder at the same level? Or within the Pages folder? Or can I put the same files in the ViewComponents folder?

---

Document Details

⚠ Do not edit this section. It is required for docs.microsoft.com ➟ GitHub issue linking.

• ID: 9d2902f4-b6fd-ba1c-6762-d7c26f5eb4b9
• Version Independent ID: b5715d72-5f10-bb93-1051-7f06dfa9cde8
• Content: View components in ASP.NET Core
• Content Source: aspnetcore/mvc/views/view-components.md
• Product: asp.net-core
• GitHub Login: @Rick-Anderson
• Microsoft Alias: riande

[guardrex]

Hello @ifo20 -- Thanks for asking. This topic is due for a 2.1 update that will convert it over to Razor Pages. The work is tracked on #5495.

The engineers did provision Razor Pages apps to have a Shared folder on aspnet/Mvc#6604. You can add a Shared folder to your Pages folder. I think* that either of these paths will be ok ...

• Pages/<controller_name>/Components/<view_component_name>/<view_name>
• Pages/Shared/Components/<view_component_name>/<view_name>

*think = I haven't tested personally.

RE: The topic update, I'll attach this issue to the sample update tracking issue. I don't think we want to patch just that one spot for Razor Pages. The topic and sample are currently geared to MVC. The topic has a awful lot of "view" language that will require attention.

[Rick-Anderson]

@ifo20 if you create a Razor Pages project with the 2.1 templates, it has Pages/Shared

[ifo20]

Ah thanks guys - I was using 2.0 hence the template did not create the Shared folder. I am now using 2.1 and created a Components folder within the Shared folder as suggested.
The below error message suggests I have three options for where I should be placing the view component 'Default.cshtml'. To me it seems the first two are consistent with the approach suggested by @guardrex , whereas I think the third option is not appropriate for Razor pages (as a Razor Pages web app isn't supposed to have a Views folder ... right? I am a beginner in this so would appreciate any confirmation)

InvalidOperationException: The view 'Components/Nav/Default' was not found. The following locations were searched: /Pages/Components/Nav/Default.cshtml /Pages/Shared/Components/Nav/Default.cshtml /Views/Shared/Components/Nav/Default.cshtml

[guardrex]

a Razor Pages web app isn't supposed to have a Views folder

An app can have both. Razor Pages works with MVC as long as there are no route conflicts between controllers and pages.

Sharing a layout among views and pages is a bit of an open question right now. A layout can be shared when full paths to it are used, but there's no "best practices" guidance from engineering yet on where to keep the layout page in the app. See the convo at #7336 (comment).