I have been learning .NET 8 Maui Blazor Hybrid for the past few months to build a multiplatform app for Windows, Android, and iPhone. It's pretty cool, but there was a learning curve. I would like to take advantage of version 9.0 so that I can extend my app to the web.

So far, it seems to start working out of the box.

But, I have two questions:

• Where should I put javascript files?
• Where and how should I reference... reference files?

Javascript Location I am confused though. Where should I put javascript files? I would have assumed that it would in the .Web project, but there is no wwwroot there. Does it go in the .Shared project? There is a wwwroot, but no index.html to reference the . What about the base project for multiplatform code? There is a wwwroot, and an index.html, but this seems like a strange place to put it.

Reference files My app uses some large files, including an LLM and some audio files. Currently these sit in the References/raw folder in the base project. I would very much like to keep it there because they are the same files.

I have been learning .NET 8 Maui Blazor Hybrid for the past few months to build a multiplatform app for Windows, Android, and iPhone. It's pretty cool, but there was a learning curve. I would like to take advantage of version 9.0 so that I can extend my app to the web.

So far, it seems to start working out of the box.

But, I have two questions:

• Where should I put javascript files?
• Where and how should I reference... reference files?

Javascript Location I am confused though. Where should I put javascript files? I would have assumed that it would in the .Web project, but there is no wwwroot there. Does it go in the .Shared project? There is a wwwroot, but no index.html to reference the . What about the base project for multiplatform code? There is a wwwroot, and an index.html, but this seems like a strange place to put it.

Reference files My app uses some large files, including an LLM and some audio files. Currently these sit in the References/raw folder in the base project. I would very much like to keep it there because they are the same files.

• blazor
• maui
• maui-blazor

1 Answer 1

Where should I put javascript files?

You can create a new folder in the wwwroot directory, and then create your JavaScript file (e.g., myScript.js) inside this folder.

In the myScript.js file, define your JavaScript functions:

function myJsFunction() {
    alert('JavaScript function called from Blazor!');
}

Where and how should I reference... reference files?

You can add a reference to the JavaScript file in the wwwroot/index.html file:

<script src="js/myScript.js"></script>

Then you can call the JavaScript function from a Blazor component:

@inject IJSRuntime JS

<button @onclick="CallJsFunction">Call JavaScript Function</button>

@code {
    private async Task CallJsFunction()
    {
        await JS.InvokeVoidAsync("myJsFunction");
    }
}

You can check this document about Call JavaScript functions from .NET methods in ASP.NET Core Blazor for more information.