David Shepard
David Shepard

Reputation: 181

Why bootstrap isn't loaded Quick Install Package

I'm building the ASP.Net Core Web Application

I installed bootstrap using Quick Install Package. So now I have it in my dependencies:

enter image description here

Also, there's a folder "node_modules" with bootstrap and everything is fine there, all classes are where they're supposed to be:

enter image description here

Then I created a view and in html wrote the following:

<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css" />

When I hover the mouse over the href, I see a warning: Path C:\Users\Shep\SportsStore\SportsStore\wwwroot\~node_modules not found Well, it's true, because there's no such folder, but how to keep it from looking in wwwroot and use the specified folder? My wwwroot is empty, I guess it's because I didn't use bower If I use the full path (href="C:/Users/Shep/SportsStore/SportsStore/node_modules/bootstrap/dist/css/bootstrap.css"), it seems right, but I bootstrap classes are unavailable:

<body>
    <div class="panel-info">
    </div>
</body>

and if I hover the mouse over, I see "Unknown CSS class 'panel-info'" even though there's this class in bootstrap.css

.panel-info {
  border-color: #bce8f1;
}

I'm not using Angular and haven't created any js files of my own yet. I have seen lots of similar issues and haven't found suitable solution, sorry if it's a duplicate

Upvotes: 0

Views: 160

Answers (1)

Nan Yu
Nan Yu

Reputation: 27538

In ASP.NET Core, the runtime supports a piece of middleware called StaticFiles that allows anything in the /wwwroot folder to be accessible from the browser. But since the node_modules directory is outside of /wwwroot ,that problem occurs .

You can use Library Manager/Bundler and Minifier to copy the files into wwwroot . There are a lot of solutions you could find from here .

Upvotes: 0

Related Questions