Blazor Visual Studio sample template - missing bootstrap.js, references missing .js files

David Thielen 2,956 Reputation points
2023-03-13T18:53:02.03+00:00

I just created a Blazer (server side) project in Visual Studio. It does include the following in _Host.cshtml:

<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
<script src="_framework/blazor.server.js"></script>
<link href="LouisHowe.styles.css" rel="stylesheet" />

And it has in the project the file wwwroot/css/bootstrap/bootstrap.min.css. But...

  1. There is no bootstrap.js anywhere in the project. And no <script... /> to include it.
  2. It does pull in blazor.server.js but I cannot find that file nor a _framework folder.
  3. It created the link to LouisHowe.styles.css but there is no LouisHowe.styles.css file. What's going on with that? (The name of my app is LouisHowe.)

So what's going on with these three issues?

thanks - dave

Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,549 questions
0 comments
Accepted answer
  1. Zhi Lv - MSFT 32,141 Reputation points Microsoft Vendor
    2023-03-14T02:26:19.36+00:00

    Hi @David Thielen

    There is no bootstrap.js anywhere in the project. And no <script... /> to include it.

    For this issue, it is by design. When using the Blazor Server App and Blazor WebAssembly App project templates to create projects, it will create a project with basic test page, and we've removed Bootstrap so that you can start with a different CSS framework.

    To use bootstrap in Blazor application, you can right click the "wwwroot" folder, click "Add" =>"Client-Side Library...", then in the popup window select the Bootstrap library and set the target location, after that click the "Install" button.

    image1

    Then, you can add find the bootstrap reference file in the target location and add the script reference in the _host.cshtml page like this:

      <script src="~/lib/bootstrap/js/bootstrap.min.js"></script>

    It does pull in blazor.server.js but I cannot find that file nor a _framework folder.

    The blazor.server.js file is an embedded resource on the Microsoft.AspNetCore.Components.Server.dll assembly, which ships as part of the ASP.NET Core shared framework. So, you can't find it in a _framework folder in the VS. But you can check the source code from the F12 developer Sources tools:

    User's image

    It created the link to LouisHowe.styles.css but there is no LouisHowe.styles.css file. What's going on with that? (The name of my app is LouisHowe.)

    In asp.net core application, by default the static files (such as HTML, CSS, images, and JavaScript) are stored within the project's web root directory.

    So, you can add the LouisHow2.css file in the wwwroot\css folder, then add the css reference like this: <link href="~/css/LouisHowe.css" />

    User's image

    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best regards,

    Dillion

    7 people found this answer helpful.

0 additional answers

Sort by: Most helpful
Most helpful Newest Oldest

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.