Open Closed

Microserive - blazor-webapp UI #7449


User avatar
0
mgurer created
  • ABP Framework version: v8.2
  • UI Type: Blazor WebApp
  • Database System: EF Core (SQL Server..)
  • Tiered (for MVC) or Auth Server Separated (for Angular): yes
  • Exception message and full stack trace:
  • Steps to reproduce the issue:

Hello,

I have created a new microservice project using the command below;

abp new BookStore -t microservice-pro -u blazor-webapp

The solution created successfully and there exists two projects in solution named BookStore.Blazor and BookStore.Blazor.Client

I also checked the following documentation;

https://docs.abp.io/en/abp/8.2/Migration-Guides/Abp-8-2-Blazor-Web-App#create-a-new-blazor-web-app

There is no project named xxx.Blazor.WebApp and xxx.Blazor.WebApp.Client as described in the document.

I assumed that xxx.Blazor.WebApp is the BookStore.Blazor project and xxx.Blazor.WebApp.Client is the BookStore.Blazor.Client in my solution. I tried to apply the steps described in the document depending on this assumption.

The steps described in the document does not seem to fit the files in the blazor projects in my solution.

For example there is no XXModule.cs in the BookStore.Blazor project but the document expects me apply some changes in the file.

So I applied the changes in client project. But for my oppinion, in the BookStore.Blazor.Client/BookStoreBlazorClientModule I expect the steps to be already applied as in the document since I have created a new microservice solution, there should be no migration need as described in document. I tried to apply the steps to this document, added PreConfigureServices method, altered ConfigureAuthentication, ran the abp bundle command, altered App.razor to share the access;_token etc.

The result is failure. These are the errors in console, when I tried to launch Blazor app in the chrome browser.

1 * Uncaught ReferenceError: bootstrap is not defined at 306 (VM63 global.js:39:71902) at n (VM63 global.js:39:72011) at 12 (VM63 global.js:39:19279) at n (VM63 global.js:39:72011) at 848 (VM63 global.js:39:32941) at n (VM63 global.js:39:72011) at 524 (VM63 global.js:39:18999) at n (VM63 global.js:39:72011) at VM63 global.js:39:72378 at VM63 global.js:39:72396

2 * crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] Unhandled exception rendering component: Could not find 'resetLeptonXToolbar' ('resetLeptonXToolbar' was undefined). Error: Could not find 'resetLeptonXToolbar' ('resetLeptonXToolbar' was undefined). at https://localhost:44307/_framework/blazor.web.js:1:734 at Array.forEach (<anonymous>) at l.findFunction (https://localhost:44307/_framework/blazor.web.js:1:702) at b (https://localhost:44307/_framework/blazor.web.js:1:5445) at https://localhost:44307/_framework/blazor.web.js:1:3238 at new Promise (<anonymous>) at y.beginInvokeJSFromDotNet (https://localhost:44307/_framework/blazor.web.js:1:3201) at Object.ri [as invokeJSJson] (https://localhost:44307/_framework/blazor.web.js:1:165152) at https://localhost:44307/_framework/dotnet.runtime.8.0.6.qp5p9if9yx.js:3:178364 at Tl (https://localhost:44307/_framework/dotnet.runtime.8.0.6.qp5p9if9yx.js:3:179198) Microsoft.JSInterop.JSException: Could not find 'resetLeptonXToolbar' ('resetLeptonXToolbar' was undefined). Error: Could not find 'resetLeptonXToolbar' ('resetLeptonXToolbar' was undefined). at https://localhost:44307/_framework/blazor.web.js:1:734 at Array.forEach (<anonymous>) at l.findFunction (https://localhost:44307/_framework/blazor.web.js:1:702) at b (https://localhost:44307/_framework/blazor.web.js:1:5445) at https://localhost:44307/_framework/blazor.web.js:1:3238 at new Promise (<anonymous>) at y.beginInvokeJSFromDotNet (https://localhost:44307/_framework/blazor.web.js:1:3201) at Object.ri [as invokeJSJson] (https://localhost:44307/_framework/blazor.web.js:1:165152) at https://localhost:44307/_framework/dotnet.runtime.8.0.6.qp5p9if9yx.js:3:178364 at Tl (https://localhost:44307/_framework/dotnet.runtime.8.0.6.qp5p9if9yx.js:3:179198) at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__16`1[[Microsoft.JSInterop.Infrastructure.IJSVoidResult, Microsoft.JSInterop, Version=8.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args) at Volo.Abp.AspNetCore.Components.WebAssembly.LeptonXTheme.Components.ApplicationLayout.SideMenu.Navigation.MobileWasmNavbar.SetMenuAndProfileAsync() at Volo.Abp.AspNetCore.Components.Web.LeptonXTheme.Components.ApplicationLayout.SideMenu.Navigation.MobileNavbar.OnInitializedAsync() at Volo.Abp.AspNetCore.Components.WebAssembly.LeptonXTheme.Components.ApplicationLayout.SideMenu.Navigation.MobileWasmNavbar.OnInitializedAsync() at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync() at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

3 *

blazor.web.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] Unhandled exception rendering component: Could not find 'initLeptonX' ('initLeptonX' was undefined). Error: Could not find 'initLeptonX' ('initLeptonX' was undefined). at https://localhost:44307/_framework/blazor.web.js:1:734 at Array.forEach (

I guess the steps in the migration document is not properly applicable for microservice projects.

So, how can I test the blazor-webapp in microservice projects?

Thanks Murat Gürer


2 Answer(s)
  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Hi,

    The microservice project doesn't support blazer-web app UI yet.

    we will support it in the next version.

  • User Avatar
    0
    mgurer created

    Thanks

    No related backlog item is listed about the update.

    https://docs.abp.io/en/commercial/latest/road-map

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11