I'm using Blazor with NET7. I created a component that is a facade of ChartJs and I like to add multiple JavaScript when the component is initialize. At the moment, I defined the interop file like:
private readonly Lazy<Task<IJSObjectReference>> moduleTask;public class ChartJsInterop{ private readonly Lazy<Task<IJSObjectReference>> moduleTask; public ChartJsInterop(IJSRuntime jsRuntime) { moduleTask = new(() => jsRuntime.InvokeAsync<IJSObjectReference>("import","./_content/PSC.Blazor.Components.Chartjs/Chart.js").AsTask()); }}This adds my custom script but I also want to add other scripts (instead of adding them in the index.html). So, I tried to do this
public ChartJsInterop(IJSRuntime jsRuntime){ moduleTask = new(() => jsRuntime.InvokeAsync<IJSObjectReference>("import","./_content/PSC.Blazor.Components.Chartjs/Chart.js").AsTask()); jsRuntime.InvokeAsync<IJSObjectReference>("import","./_content/PSC.Blazor.Components.Chartjs/lib/Chart.js/chart.js").AsTask(); jsRuntime.InvokeAsync<IJSObjectReference>("import","./_content/PSC.Blazor.Components.Chartjs/lib/hammer.js/hammer.js").AsTask();}In this case, the application doesn't find immediately the scripts and returns a lot of errors. After few seconds, the scripts are loaded and the application show the graphs as I expected.
I want to avoid errors. How can I load multiple JavaScript in the ChartJsInterop? Is it possible to extend the moduleTask = new(() => jsRuntime.InvokeAsync<IJSObjectReference>(...); with multiple scripts?