Bootstrap dropdown not working when blazor app is published

I have a blazor server-side app and I have the following component:

<div class="card-tools"><div class="btn-group text-right"><button type="button" class="btn btn-tool dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="far fa-calendar-alt"></i></button><div class="dropdown-menu dropdown-menu-right"><button class="dropdown-item" type="button" @onclick='() => {ItemClick("1");}'>Item 1</button><button class="dropdown-item" type="button" @onclick='() => {ItemClick("2");}'>Item 2</button><button class="dropdown-item" type="button" @onclick='() => {ItemClick("3");}'>Item 3</button></div></div></div>@code {    [Parameter]    public EventCallback<string> OnItemClicked { get; set; }    private void ItemClick(string condition)    {        OnItemClicked.InvokeAsync(condition);      }}

I also include jquery 3.6 and bootstrap 4.6 in the _Host.chtml.

When I run the app in VS, the dropdown is displayed as expected. However, when I publish the app, the dropdown is not being displayed.

What could be wrong?