diff --git a/aspnetcore/6.0/blazor/components/class-libraries.md b/aspnetcore/6.0/blazor/components/class-libraries.md index 82939e244542..fa3b22934258 100644 --- a/aspnetcore/6.0/blazor/components/class-libraries.md +++ b/aspnetcore/6.0/blazor/components/class-libraries.md @@ -239,7 +239,7 @@ When the `Link` component is used in a child component, the linked asset is also An alternative to using the `Link` component is to link to the library's stylesheet in the app's `` markup. -`wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Host.cshtml` file (Blazor Server): +`wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Layout.cshtml` file (Blazor Server): ```diff + diff --git a/aspnetcore/6.0/blazor/components/css-isolation.md b/aspnetcore/6.0/blazor/components/css-isolation.md index 3249d7ec82f7..02f9b199e780 100644 --- a/aspnetcore/6.0/blazor/components/css-isolation.md +++ b/aspnetcore/6.0/blazor/components/css-isolation.md @@ -45,7 +45,7 @@ h1 { ## CSS isolation bundling -CSS isolation occurs at build time. Blazor rewrites CSS selectors to match markup rendered by the component. The rewritten CSS styles are bundled and produced as a static asset. The stylesheet is referenced inside the `` tag of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server). The following `` element is added by default to an app created from the Blazor project templates, where the placeholder `{ASSEMBLY NAME}` is the project's assembly name: +CSS isolation occurs at build time. Blazor rewrites CSS selectors to match markup rendered by the component. The rewritten CSS styles are bundled and produced as a static asset. The stylesheet is referenced inside the `` tag of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server). The following `` element is added by default to an app created from the Blazor project templates, where the placeholder `{ASSEMBLY NAME}` is the project's assembly name: ```html @@ -208,7 +208,7 @@ In the following example: * The static web asset base path is `_content/ClassLib`. * The class library's assembly name is `ClassLib`. -`wwwroot/index.html` (Blazor WebAssembly) or `Pages_Host.cshtml` (Blazor Server): +`wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server): ```html diff --git a/aspnetcore/6.0/blazor/components/event-handling.md b/aspnetcore/6.0/blazor/components/event-handling.md index ed70327c4831..72b5cc7f454d 100644 --- a/aspnetcore/6.0/blazor/components/event-handling.md +++ b/aspnetcore/6.0/blazor/components/event-handling.md @@ -94,7 +94,7 @@ Custom events with custom event arguments are generally enabled with the followi } ``` -1. Register the custom event with the preceding handler in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server) immediately after the Blazor ` + + ``` - * Update the Blazor script source to use the client-side Blazor WebAssembly script: + * In the `_Host.cshtml` file, update the `render-mode` of the [Component Tag Helper](xref:mvc/views/tag-helpers/builtin-th/component-tag-helper) to prerender the root `App` component with : ```diff - - - + + - + + ``` 1. In `Startup.Configure` of the **`Server`** project, change the fallback from the `index.html` file to the `_Host.cshtml` page. @@ -653,16 +653,14 @@ For more information, see . Without preserving prerendered state, any state that used during prerendering is lost and must be recreated when the app is fully loaded. If any state is setup asynchronously, the UI may flicker as the the prerendered UI is replaced with temporary placeholders and then fully rendered again. -To solve these problems, Blazor supports persisting state in a prerendered page using the [Preserve Component State Tag Helper](xref:mvc/views/tag-helpers/builtin-th/preserve-component-state-tag-helper) (``). Add the `` tag inside the closing `` tag of `_Host.cshtml`. +To solve these problems, Blazor supports persisting state in a prerendered page using the [Preserve Component State Tag Helper](xref:mvc/views/tag-helpers/builtin-th/preserve-component-state-tag-helper) (``). Add the `` tag inside the closing `` tag of `_Layout.cshtml`. ::: zone pivot="webassembly" -`Pages/_Host.cshtml`: +`Pages/_Layout.cshtml`: ```cshtml - - ... @@ -673,12 +671,10 @@ To solve these problems, Blazor supports persisting state in a prerendered page ::: zone pivot="server" -`Pages/_Host.cshtml`: +`Pages/_Layout.cshtml`: ```cshtml - - ... diff --git a/aspnetcore/6.0/blazor/fundamentals/handle-errors.md b/aspnetcore/6.0/blazor/fundamentals/handle-errors.md index c81dff06a716..7ad049eb2fa6 100644 --- a/aspnetcore/6.0/blazor/fundamentals/handle-errors.md +++ b/aspnetcore/6.0/blazor/fundamentals/handle-errors.md @@ -230,7 +230,7 @@ When a Blazor app isn't functioning properly during development, receiving detai The UI for this error handling experience is part of the [Blazor project templates](xref:blazor/project-structure). -In a Blazor Server app, customize the experience in the `Pages/_Host.cshtml` file: +In a Blazor Server app, customize the experience in the `Pages/_Layout.cshtml` file: ```cshtml
diff --git a/aspnetcore/6.0/blazor/fundamentals/routing.md b/aspnetcore/6.0/blazor/fundamentals/routing.md index 668bff0b6efd..8b4a23a9b529 100644 --- a/aspnetcore/6.0/blazor/fundamentals/routing.md +++ b/aspnetcore/6.0/blazor/fundamentals/routing.md @@ -39,7 +39,7 @@ Components support multiple route templates using multiple [`@page` directives]( [!code-razor[](~/6.0/blazor/samples/BlazorSample_WebAssembly/Pages/routing/BlazorRoute.razor?highlight=1-2)] > [!IMPORTANT] -> For URLs to resolve correctly, the app must include a `` tag in its `wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Host.cshtml` file (Blazor Server) with the app base path specified in the `href` attribute. For more information, see . +> For URLs to resolve correctly, the app must include a `` tag in its `wwwroot/index.html` file (Blazor WebAssembly) or `Pages/_Layout.cshtml` file (Blazor Server) with the app base path specified in the `href` attribute. For more information, see . The doesn't interact with query string values. To work with query strings, see the [Query string and parse parameters](#query-string-and-parse-parameters) section. @@ -226,7 +226,7 @@ Use to manage URIs and | Member | Description | | ------ | ----------- | | | Gets the current absolute URI. | -| | Gets the base URI (with a trailing slash) that can be prepended to relative URI paths to produce an absolute URI. Typically, corresponds to the `href` attribute on the document's `` element in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server). | +| | Gets the base URI (with a trailing slash) that can be prepended to relative URI paths to produce an absolute URI. Typically, corresponds to the `href` attribute on the document's `` element in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server). | | | Navigates to the specified URI. If `forceLoad` is `true`:
  • Client-side routing is bypassed.
  • The browser is forced to load the new page from the server, whether or not the URI is normally handled by the client-side router.
| | | An event that fires when the navigation location has changed. | | | Converts a relative URI into an absolute URI. | diff --git a/aspnetcore/6.0/blazor/fundamentals/signalr.md b/aspnetcore/6.0/blazor/fundamentals/signalr.md index 8c0ee2e35f36..9c5867ca7d3c 100644 --- a/aspnetcore/6.0/blazor/fundamentals/signalr.md +++ b/aspnetcore/6.0/blazor/fundamentals/signalr.md @@ -135,9 +135,9 @@ In `Startup.Configure`, Blazor Server apps call ` of the `_Host.cshtml` Razor page. +To customize the UI, define an element with an `id` of `components-reconnect-modal` in the `` of the `_Layout.cshtml` Razor page. -`Pages/_Host.cshtml`: +`Pages/_Layout.cshtml`: ```cshtml
@@ -174,7 +174,7 @@ By default, Blazor Server apps prerender the UI on the server before the client ## Blazor startup -Configure the manual start of a Blazor Server app's [SignalR circuit](xref:blazor/hosting-models#circuits) in the `Pages/_Host.cshtml` file: +Configure the manual start of a Blazor Server app's [SignalR circuit](xref:blazor/hosting-models#circuits) in the `Pages/_Layout.cshtml` file: * Add an `autostart="false"` attribute to the ``, where the `{SCRIPT PATH AND FILE NAME (.js)}` placeholder is the path and file name of the script. +Place the following ``, where the `{SCRIPT PATH AND FILE NAME (.js)}` placeholder is the path and file name of the script. ```javascript `) in the `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server): +Place the script (``) in the `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server): ```html @@ -68,7 +68,7 @@ Loading JS from the `` isn't the best approach for the following reasons: ### Load a script in `` markup -Place the script (``) inside the closing `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server): +Place the script (``) inside the closing `` element markup of `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server): ```html @@ -89,7 +89,7 @@ The `{webassembly|server}` placeholder in the preceding markup is either `webass Place the script (``) with a script `src` path inside the closing `` tag after the Blazor script reference. -In `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server): +In `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server): ```html @@ -136,7 +136,7 @@ For more information, see . ### Inject a script after Blazor starts -Load JS from an injected script in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Host.cshtml` (Blazor Server) when the app is initialized: +Load JS from an injected script in `wwwroot/index.html` (Blazor WebAssembly) or `Pages/_Layout.cshtml` (Blazor Server) when the app is initialized: * Add `autostart="false"` to the ``) inside the closing `` tag after the Blazor script is loaded. diff --git a/aspnetcore/6.0/blazor/project-structure.md b/aspnetcore/6.0/blazor/project-structure.md index 52852d6f5e27..ed242290c66d 100644 --- a/aspnetcore/6.0/blazor/project-structure.md +++ b/aspnetcore/6.0/blazor/project-structure.md @@ -61,13 +61,14 @@ The Blazor Server template creates the initial files and directory structure for * `_Host.cshtml`: The root page of the app implemented as a Razor Page: * When any page of the app is initially requested, this page is rendered and returned in the response. * The Host page specifies where the root `App` component (`App.razor`) is rendered. + * `_Layout.cshtml`: The layout page for the `_Host.cshtml` root page of the app. * `Counter` component (`Counter.razor`): Implements the Counter page. * `Error` component (`Error.razor`): Rendered when an unhandled exception occurs in the app. * `FetchData` component (`FetchData.razor`): Implements the Fetch data page. * `Index` component (`Index.razor`): Implements the Home page. > [!NOTE] -> JavaScript (JS) files added to the `Pages/_Host.cshtml` file should appear before the closing `` tag. The order that custom JS code is loaded from JS files is important in some scenarios. For example, ensure that JS files with interop methods are included before Blazor framework JS files. +> JavaScript (JS) files added to the `Pages/_Layout.cshtml` file should appear before the closing `` tag. The order that custom JS code is loaded from JS files is important in some scenarios. For example, ensure that JS files with interop methods are included before Blazor framework JS files. * `Properties/launchSettings.json`: Holds [development environment configuration](xref:fundamentals/environments#development-and-launchsettingsjson). diff --git a/aspnetcore/6.0/blazor/security/content-security-policy.md b/aspnetcore/6.0/blazor/security/content-security-policy.md index ccd89fcb2571..ae4250ec7c8d 100644 --- a/aspnetcore/6.0/blazor/security/content-security-policy.md +++ b/aspnetcore/6.0/blazor/security/content-security-policy.md @@ -96,7 +96,7 @@ The particular script associated with the error is displayed in the console next ### Blazor Server -In the `` content of the `Pages/_Host.cshtml` host page, apply the directives described in the [Policy directives](#policy-directives) section: +In the `` content of the `Pages/_Layout.cshtml` host page, apply the directives described in the [Policy directives](#policy-directives) section: ```cshtml ``` +Prerendering of `` content is disabled in `Pages/_Layout.cshtml`: + +```cshtml + +``` + Prerendering might be useful for other pages that don't use `localStorage` or `sessionStorage`. To retain prerendering, defer the loading operation until the browser is connected to the circuit. The following is an example for storing a counter value: ```razor