vikramlearning / blazorbootstrap-starter-templates

Blazor Bootstrap - Starter Templates (.NET 6/7/8)

Starter templates

.NET 8

1. Blazor Bootstrap - WebAssembly - Standalone App

   

2. Blazor Bootstrap - WebApp - Server - Global

   

3. Blazor Bootstrap - WebApp - Auto - Global

   

.NET 7

1. Blazor Bootstrap - WebAssembly App

   

2. Blazor Bootstrap - Empty WebAssembly App

   

3. Blazor Bootstrap - Server App

   

4. Blazor Bootstrap - Empty Server App

   

.NET 6

1. Blazor Bootstrap - WebAssembly App

   

2. Blazor Bootstrap - Server App

   

blazorbootstrap-starter-templates's Issues

Unable to run Net8.BlazorAutoPerPage

I've seen that in the repository there's an example of Blazor auto per page/component. I've seen that I cannot run it anyway. It looks like the problem is from the Routes.razor file in the Client project, which refers Layout.MainLayout, which is in the server project.

Are there working examples of the per page/component interactive mode? Is there a reason why this example is not referenced in the documentation?

Kind regards :)

Blazor templates outdated

I believe from .NET 8.0 (although at least from the current version) the file templates were updated to a different structure. There is no more index.html and for client and server sided rendering two folders are generated instead of only one.

Could not find window.blazorBootsrap.collapse.initialize ('blazorBootsrap' was undefined)

Hello,
I just installed BlazorBootstrap on a Blazor Web App project on .Net 8. I am having a problem with a component that's using Accordion. This is the error I am seeing:

Error: Microsoft.JSInterop.JSException: Could not find 'window.blazorBootstrap.collapse.initialize' ('blazorBootstrap' was undefined).
Error: Could not find 'window.blazorBootstrap.collapse.initialize' ('blazorBootstrap' was undefined).
at https://localhost:7281/_framework/blazor.web.js:1:734
at Array.forEach ()
at l.findFunction (https://localhost:7281/_framework/blazor.web.js:1:702)
at b (https://localhost:7281/_framework/blazor.web.js:1:5445)
at https://localhost:7281/_framework/blazor.web.js:1:3238
at new Promise ()
at y.beginInvokeJSFromDotNet (https://localhost:7281/_framework/blazor.web.js:1:3201)
at fn._invokeClientMethod (https://localhost:7281/_framework/blazor.web.js:1:62541)
at fn._processIncomingData (https://localhost:7281/_framework/blazor.web.js:1:60016)
at connection.onreceive (https://localhost:7281/_framework/blazor.web.js:1:53657)
at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)
at BlazorBootstrap.Collapse.b__4_0()
at BlazorBootstrap.BlazorBootstrapComponentBase.OnAfterRenderAsync(Boolean firstRender)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

I tried it in both Server and WebAssembly projects, and got the error in both. I followed your instructions to make sure I didn't miss anything: Getting Started.

Demo

Describe the bug
Hi i have downloaded your empty .net 7 demo and found that when i compile it,at the bottom of the page i get an unhandled exception. I have not added any code. I would assume that the issue lies in your component.

We use visual studio 2022 professional.

I have also tried your installation instructions a get the same issue.

I like your offering cam you help

Regards ettienne

Border around page heading

On startup of the Demo Apps (Server and WebAssembly) the "Hello, World" heading appears with a border, as if it was selected using the tab key. It occurs in Firefox and Edge.
How can I avoid this?

Error when starting template

I am trying to run the wasm template and get the following error:

The server template runs fine.

Exception Message is always shown

On startup of the NET6.BlazorServerApp project, the exception warning "An unhandled exception has occurred. See browser dev tools for details." is shown at the bottom of the page. I need to scroll down do have it visible. I believe there is no exception, at least there is none shown in VS or browser console.

How to get this working? One could remove the <div id="blazor-error-ui"> from _Layout.cshtml, but then there would be no exception notification at all.

Issues setting up the .NET 8 starter template

Hi there

When running the NET8.BlazorWebAppRenderModeServerGlobal it the following error

Severity Code Description Project File Line Suppression State
Error MSB4018 The "GenerateStaticWebAsssetsPropsFile" task failed unexpectedly.
System.IO.DirectoryNotFoundException: Could not find a part of the path 'C:\Users\Birger\Source\Repos\blazorbootstrap-starter-templates\src\BlazorBootstrap.Templates.Starter\NET8.BlazorWebAppRenderModeServerGlobal\obj\Debug\net8.0\staticwebassets\msbuild.NET8.BlazorWebAppRenderModeServerGlobal.Microsoft.AspNetCore.StaticWebAssets.props'.
at System.IO.__Error.WinIOError(Int32 errorCode, String maybeFullPath)
at System.IO.FileStream.Init(String path, FileMode mode, FileAccess access, Int32 rights, Boolean useRights, FileShare share, Int32 bufferSize, FileOptions options, SECURITY_ATTRIBUTES secAttrs, String msgPath, Boolean bFromProxy, Boolean useLongPath, Boolean checkHost)
at System.IO.FileStream..ctor(String path, FileMode mode, FileAccess access, FileShare share, Int32 bufferSize, FileOptions options, String msgPath, Boolean bFromProxy, Boolean useLongPath, Boolean checkHost)
at System.IO.File.InternalWriteAllBytes(String path, Byte[] bytes, Boolean checkHost)
at Microsoft.AspNetCore.StaticWebAssets.Tasks.GenerateStaticWebAsssetsPropsFile.ExecuteCore()
at Microsoft.Build.BackEnd.TaskExecutionHost.Microsoft.Build.BackEnd.ITaskExecutionHost.Execute()
at Microsoft.Build.BackEnd.TaskBuilder.d__26.MoveNext() NET8.BlazorWebAppRenderModeServerGlobal C:\Program Files\dotnet\sdk\8.0.100\Sdks\Microsoft.NET.Sdk.StaticWebAssets\targets\Microsoft.NET.Sdk.StaticWebAssets.Pack.targets 136

When following the startup guide here instead

https://docs.blazorbootstrap.com/getting-started/blazor-webapp-server-global-net-8

I get an error in the developer console

Failed to load resource: the server responded with a status of 404 () https://localhost:7066/NET8.BlazorWebAppRenderModeServerGlobal.styles.css

Side bar2 not visible on full window expand

@inherits LayoutComponentBase

<Sidebar2 ImageSrc="https://demos.blazorbootstrap.com/images/logo/logo-white.svg"
          Title="Blazor Bootstrap"
          BadgeText="v2.1.0"
          DataProvider="Sidebar2DataProvider" />

<main>
    <div class="bb-top-row px-4 d-flex justify-content-end">
        <a href="https://docs.microsoft.com/aspnet/" target="_blank">About</a>
    </div>

    <article class="content px-4">
        <div class="py-2">Page content goes here</div>
    </article>
</main>

@code {
IEnumerable? navItems;

private async Task<Sidebar2DataProviderResult> Sidebar2DataProvider(Sidebar2DataProviderRequest request)
{
    if (navItems is null)
        navItems = GetNavItems();

    await Task.Delay(2000);

    return await Task.FromResult(request.ApplyTo(navItems));
}

private IEnumerable<NavItem> GetNavItems()
{
    navItems = new List<NavItem>
    {
        new NavItem { Id = "1", Href = "/getting-started", IconName = IconName.HouseDoorFill, Text = "Getting Started"},

        new NavItem { Id = "2", IconName = IconName.LayoutSidebarInset, Text = "Content", IconColor = IconColor.Primary },
        new NavItem { Id = "3", Href = "/icons", IconName = IconName.PersonSquare, Text = "Icons", ParentId="2"},

        new NavItem { Id = "4", IconName = IconName.ExclamationTriangleFill, Text = "Components", IconColor = IconColor.Success },
        new NavItem { Id = "5", Href = "/alerts", IconName = IconName.CheckCircleFill, Text = "Alerts", ParentId="4"},
        new NavItem { Id = "6", Href = "/breadcrumb", IconName = IconName.SegmentedNav, Text = "Breadcrumb", ParentId="4"},

        new NavItem { Id = "7", IconName = IconName.ListNested, Text = "Sidebar 2", ParentId="4"},
        new NavItem { Id = "701", Href = "/sidebar2/how-to-use", IconName = IconName.Dash, Text = "How to use", ParentId="7"},

        new NavItem { Id = "702", IconName = IconName.Dash, Text = "Examples", ParentId="7"},
        new NavItem { Id = "70201", Href = "/sidebar2", IconName = IconName.Dash, Text = "Nested levels", ParentId="702"},

        new NavItem { Id = "8", IconName = IconName.Grid, Text = "Grid", ParentId="4", IconColor = IconColor.Danger },
        new NavItem { Id = "801", Href = "/grid/#", IconName = IconName.Dash, Text = "How to use", ParentId="8"},
        new NavItem { Id = "802", IconName = IconName.Dash, Text = "Examples", ParentId="8"},
        new NavItem { Id = "80201", Href = "/grid/#", IconName = IconName.Dash, Text = "Filters", ParentId="802"},

        new NavItem { Id = "9", IconName = IconName.WindowPlus, Text = "Forms", IconColor = IconColor.Warning },
        new NavItem { Id = "10", Href = "/autocomplete", IconName = IconName.InputCursorText, Text = "Auto Complete", ParentId="9"},
        new NavItem { Id = "11", Href = "/currency-input", IconName = IconName.CurrencyDollar, Text = "Currency Input", ParentId="9"},
        new NavItem { Id = "12", Href = "/number-input", IconName = IconName.InputCursor, Text = "Number Input", ParentId="9"},
        new NavItem { Id = "13", Href = "/switch", IconName = IconName.ToggleOn, Text = "Switch", ParentId="9"},
    };

    return navItems;
}

}

An unhandled error has occurred. Reload 🗙