Error using Blazorise together with Monaco Editor

[yuramag]

When adding Blazorise to a project that already contains Monaco Editor I get the following exception in the browser console:

Microsoft.JSInterop.JSException: Can only have one anonymous define call per script file
Error: Can only have one anonymous define call per script file

Seems like there is some sort of conflict between the JS code backing Tooltip component and BlazorMonaco internals. Any suggestion on how to address this problem?

[stsrki]

Quick googling indicates that the error is known for the Monaco editor. According to this, the JS involved would somehow be loaded sooner to solve it. We would need to investigate it to see what can be done.

[yuramag]

Any updates on this one? It has become a real showstopper unfortunately.

[David-Moreira]

I'm sorry we understand that this can be frustrating to deal with. And it might still take a while for us to get to this issue. Can you further investigate the issue that @stsrki linked?

On our side, I could recommend trying this, see if it can help? https://blazorise.com/docs/pwa

Also what is Toolbox? Did you mean a component of ours? We don't have a Toolbox named component.

[stsrki]

On a side note, we need to update the JS modules list and add a version after the .js extension.

[yuramag]

Also what is Toolbox? Did you mean a component of ours? We don't have a Toolbox named component.

My apologies, I meant Tooltip of course. Also updated the above description.

[yuramag]

I've tried both suggestions above with no luck. Here is the basic project to reproduce the issue: https://github.com/yuramag/BlazoriseWithMonaco

[StefH]

@stsrki

I run into the same error while using BlazorMonaco or Semi.Design.Blazor.Monaco.Editor in a Blazorise project.

Both give error:

Microsoft.JSInterop.JSException: Can only have one anonymous define call per script file
Error: Can only have one anonymous define call per script file
    at s.enqueueDefineAnonymousModule (https://cdn.masastack.com/npm/monaco-editor/0.34.1/min/vs/loader.js:8:5413)
    at g (https://cdn.masastack.com/npm/monaco-editor/0.34.1/min/vs/loader.js:9:1857)
    at https://localhost:44351/_content/Blazorise/vendors/sha512.js?v=1.3.3.0:9:17673
    at https://localhost:44351/_content/Blazorise/vendors/sha512.js?v=1.3.3.0:9:17703
   at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__16`1[[Microsoft.JSInterop.IJSObjectReference, Microsoft.JSInterop, Version=8.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext()
   at Blazorise.Modules.BaseJSModule.InvokeSafeVoidAsync(String identifier, Object[] args)
   at Blazorise.TextEdit.OnFirstAfterRenderAsync()
   at Blazorise.BaseAfterRenderComponent.OnAfterRenderAsync(Boolean firstRender)
   at Blazorise.BaseComponent.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

[David-Moreira]

Hello,

It seems the BlazorMonaco project is maintained by a single user, with not a lot of support? Understandable if it's more like a hobby project.

---

Anyway, Relevant issue over at BlazorMonaco: https://github.com/serdarciplak/BlazorMonaco/issues/81

I think this user is on to something :

I think there's a version of the Monaco loader in ESM? So using that one instead of the AMD one could work? Could someone try to figure it out and let us know if it works?

[yuramag]

Solution has been found here: https://github.com/serdarciplak/BlazorMonaco/issues/81#issuecomment-1874646448