All methods have been used to run metronic8 theme18 in blazor server,But the theme didn't work properly every time

method 1

1- The method was followed as described in your link:

build assets by using webpack https://preview.keenthemes.com/metronic8/demo18/documentation/getting-started/integration/blazor.html

I have error when load our js components and plugins files asynchronously as shown below:

@inject IJSRuntime JS @inject NavigationManager MyNavigationManager

@code { protected override async Task OnAfterRenderAsync(bool firstRender) { if (firstRender) { await JS.InvokeAsync<IJSObjectReference>("import", MyNavigationManager.ToAbsoluteUri("assets/plugins/global/plugins.bundle.js")); await JS.InvokeAsync<IJSObjectReference>("import", MyNavigationManager.ToAbsoluteUri("assets/js/scripts.bundle.js"));

    }
}

}

[2022-02-21T21:02:30.853Z] Error: Microsoft.JSInterop.JSException: Cannot set properties of undefined (setting 'moment') TypeError: Cannot set properties of undefined (setting 'moment') at https://localhost:44343/assets/plugins/global/plugins.bundle.js:25:168435 at https://localhost:44343/assets/plugins/global/plugins.bundle.js:25:168440 at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args) at WebApplication1.Shared.MainLayout.OnAfterRenderAsync(Boolean firstRender) in C:\Users\hp\Desktop\New folder (21)\blazor\WebApplication1\WebApplication1\Shared\MainLayout.razor:line 7610 at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)

=========================================================

******* method 2 *******

I'm using (components initialization) from External file js

1-External file js Scriptinitial.js put in _hots.cshtml

this Scriptinitial.js contains the following code :

function initial() {
// Boostrap & 3rd-party components initialization

KTApp.init(); // In-house components initialization KTMenu.createInstances(); KTDrawer.createInstances(); KTScroll.createInstances(); KTScrolltop.createInstances(); KTSticky.createInstances(); KTDialer.createInstances(); KTImageInput.createInstances(); KTPasswordMeter.createInstances(); KTSwapper.createInstances(); KTToggle.createInstances();

}

2- call this function in layout as the following code :

protected override async Task OnAfterRenderAsync(bool firstRender=false) { if (firstRender) { await JsRuntime.InvokeVoidAsync("initial"); StateHasChanged(); } }

but something not work fine such as [dropzone,Editor,tags in product , charts modal steps ..etc] maybe this script blazor.server.js conflict with another script in metronic8

If you need to upload the blazor server with metronic8 drive Or send a demonstration video tell me about it