jsakamoto / Toolbelt.Blazor.HeadElement

Head element support (change the document title, "meta" elements such as OGP, and "link" elements) for Blazor apps.
https://demo-blazor-headelement.azurewebsites.net/
Mozilla Public License 2.0
158 stars 11 forks source link

Change Html base tag #36

Open HTTPThanhLuan opened 1 year ago

HTTPThanhLuan commented 1 year ago

Is it possible to change html base tag?

<base href="/" />

The dev and production environment have different href value. I would like to change the value dynamically instead of manually.

jsakamoto commented 1 year ago

@HTTPThanhLuan

Unfortunately, the duty of changing the HTML base tag is over the cover area of this library.

However, you can change the HTML base tag dynamically in various ways.

  1. If your Blazor app is a Blazor Server app or an ASP.NET Core hosted Blazor WebAssembly app, you can change HTML base tag dynamically based on pre-rendering technic with the ASP.NET Core Razor Pages feature or ASP.NET MVC Views feature. see also: https://learn.microsoft.com/aspnet/core/blazor/components/prerendering-and-integration

  2. If your Blazor app is a Blazor WebAssembly app and you want to deploy it on GitHub Pages, you don't need to worry about how to change the HTML base tag. What you should do is only add the "PublishSPAforGitHubPages.Build" the NuGet package to your project. That package will take care of changing the HTML base tag automatically instead of you. see also: https://www.nuget.org/packages/PublishSPAforGitHubPages.Build#readme-body-tab

  3. If your Blazor app is a Blazor WebAssembly app, you can also configure your project (MSBuild script) to change the HTML base tag in the wwwroot/index.html in your project automatically by shell script every time you publish it. (I don't have examples how to implement this way)

  4. If your production environment is only one URL (you don't have more than one production environment), you can also configure your development environment's HTML base tag to be aligned with the production environment's. Actually, you don't need to stick the development environment base URL to be the root "/" URL. see also: https://learn.microsoft.com/aspnet/core/blazor/host-and-deploy/

Are there any options in the above list to fit your case?

Alerinos commented 1 year ago

@HTTPThanhLuan You can use this method as well.

        <environment include="Staging,Production">
            <base href="/prod/" />
        </environment>
        <environment include="Development">
           <base href="/dev/" />
        </environment>