MudBlazor - ASP.NET Core hosted

Question

I have created .NET 7 Blazor-hosted application with Identity Server 4 and role-based authentication - the latest version.

There is page fetchdata as we know - it comes out of the box.

I have tried to remove bootstrap, CSS files etc, as per other topics of StackOverflow, thng is, this is the latest version of .NET and with previous versions, I did not have these issues, the process was the same.

I have added the latest version of MudBlazor:

problem does not exist once I access fetchdata component via menu
this problem appears once I try to access fetchdata directly from the URL

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] Unhandled exception rendering component: Could not find 'mudElementRef.getBoundingClientRect' ('mudElementRef' was undefined). Error: Could not find 'mudElementRef.getBoundingClientRect' ('mudElementRef' was undefined). at https://localhost:7060/_framework/blazor.webassembly.js:1:328 at Array.forEach () at a.findFunction (https://localhost:7060/_framework/blazor.webassembly.js:1:296) at _ (https://localhost:7060/_framework/blazor.webassembly.js:1:2442) at https://localhost:7060/_framework/blazor.webassembly.js:1:3330 at new Promise () at Object.beginInvokeJSFromDotNet (https://localhost:7060/_framework/blazor.webassembly.js:1:3311) at Object.Gt [as invokeJSFromDotNet] (https://localhost:7060/_framework/blazor.webassembly.js:1:62537) at Object.Ii (https://localhost:7060/_framework/dotnet.7.0.0.amub20uvka.js:5:71465) at _mono_wasm_invoke_js_blazor (https://localhost:7060/_framework/dotnet.7.0.0.amub20uvka.js:14:103886) Microsoft.JSInterop.JSException: Could not find 'mudElementRef.getBoundingClientRect' ('mudElementRef' was undefined). Error: Could not find 'mudElementRef.getBoundingClientRect' ('mudElementRef' was undefined). at https://localhost:7060/_framework/blazor.webassembly.js:1:328 at Array.forEach () at a.findFunction (https://localhost:7060/_framework/blazor.webassembly.js:1:296) at _ (https://localhost:7060/_framework/blazor.webassembly.js:1:2442) at https://localhost:7060/_framework/blazor.webassembly.js:1:3330 at new Promise () at Object.beginInvokeJSFromDotNet (https://localhost:7060/_framework/blazor.webassembly.js:1:3311) at Object.Gt [as invokeJSFromDotNet] (https://localhost:7060/_framework/blazor.webassembly.js:1:62537) at Object.Ii (https://localhost:7060/_framework/dotnet.7.0.0.amub20uvka.js:5:71465) at _mono_wasm_invoke_js_blazor (https://localhost:7060/_framework/dotnet.7.0.0.amub20uvka.js:14:103886) at Microsoft.JSInterop.JSRuntime.d__16`1[[MudBlazor.Interop.BoundingClientRect, MudBlazor, Version=6.1.5.0, Culture=neutral, PublicKeyToken=null]].MoveNext() at MudBlazor.MudDrawer.UpdateHeight() at MudBlazor.MudDrawer.OnAfterRenderAsync(Boolean firstRender) at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState) <

How do you remove Bootstrap from Blazor?

maciek
– maciek

2022-12-18 14:00:27 +00:00
Commented Dec 18, 2022 at 14:00 — maciek
– maciek, Commented Dec 18, 2022 at 14:00

J S · Accepted Answer · 2022-12-18 14:13:56Z

0

All that you have to do is to add AddMudServices() under the builder in the Program.cs pipeline - under the builder on the top.

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

builder.Services.AddMudServices();

as well you don't need to delete bootstrap and custom CSS style files.

answered Dec 18, 2022 at 14:13

J S

88910 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

MudBlazor - ASP.NET Core hosted

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related