blazornugetblazor-webassemblytelerik-reportingrazor-components

Blazor component - Failed to fetch dynamically imported module - telerikReportViewer


I have calling the component <AppReportViewer/> in the frontend .razor file.

I get this error when i open up the component in frontend after building the application:

GET https://localhost:44319/_content/AppMain.Components/telerikReportViewer.js.razor.js net::ERR_ABORTED 404 (Not Found)
(anonymous) @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
beginInvokeJSFromDotNet @ blazor.webassembly.js:1
bn @ blazor.webassembly.js:1
(anonymous) @ invoke-js.ts:233
Ul @ invoke-js.ts:276
$func350 @ 00b1ee2e:0x1faef
$func246 @ 00b1ee2e:0x1bf8c
$func239 @ 00b1ee2e:0xf173
$func273 @ 00b1ee2e:0x1d1b1
$func3185 @ 00b1ee2e:0xe81aa
$func2506 @ 00b1ee2e:0xbdf5b
$func2512 @ 00b1ee2e:0xbe75c
$func2536 @ 00b1ee2e:0xc0db3
$mono_wasm_invoke_method_bound @ 00b1ee2e:0xa526
Module._mono_wasm_invoke_method_bound @ dotnet.native.8.0.1.z35rpqq4ur.js:8
kr @ invoke-cs.ts:273
(anonymous) @ invoke-cs.ts:247
beginInvokeDotNetFromJS @ blazor.webassembly.js:1
invokeDotNetMethodAsync @ blazor.webassembly.js:1
invokeMethodAsync @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
N @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
invokeWhenHeapUnlocked @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
N @ blazor.webassembly.js:1
C @ blazor.webassembly.js:1
dispatchGlobalEventToAllElements @ blazor.webassembly.js:1
onGlobalEvent @ blazor.webassembly.js:1
blazor.webassembly.js:1  crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: Failed to fetch dynamically imported module: https://localhost:44319/_content/AppMain.Components/telerikReportViewer.js.razor.js
      TypeError: Failed to fetch dynamically imported module: https://localhost:44319/_content/AppMain.Components/telerikReportViewer.js.razor.js
Microsoft.JSInterop.JSException: Failed to fetch dynamically imported module: https://localhost:44319/_content/AppMain.Components/telerikReportViewer.js.razor.js
TypeError: Failed to fetch dynamically imported module: https://localhost:44319/_content/AppMain.Components/telerikReportViewer.js.razor.js
   at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__16`1[[Microsoft.JSInterop.IJSObjectReference, Microsoft.JSInterop, Version=8.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext()
   at AppMain.Components.Extensions.Extensions.ImportModule(IJSRuntime js, String path)
   at AppMain.Components.AppReportViewer.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

To rectify the error above i have made sure that i have installed the necessary Nuget packages, modified Index.html file to include necessary scripts both in head and body. Cannot make any changes to the component itself because it is auto generated by the Nuget package when the Project is started. Placed manually downloaded telerikReportViewer.js into wwwroot folder as well as JS subfolder inside wwwroot. Nothing has fixed the issue yet.


Solution

  • The issue was my boss having custom nuget packages, us not having access to their code and him messing things up there.