I am trying to develop my first ASP.NET Core anycodings_visual-studio-2019 MVC (SDK .Net 5 )Application.
When running the application from inside VS anycodings_visual-studio-2019 Studio 2019, I am having trouble loading anycodings_visual-studio-2019 bootstrap and jquery client libraries.
I have added the latest **bootstrap anycodings_visual-studio-2019 (5.1.3)**and **jquery (3.6.0)**client anycodings_visual-studio-2019 libraries from Library manager. I have anycodings_visual-studio-2019 installed them in lib\twitter-bootstrap and anycodings_visual-studio-2019 lib\jquery directory of my project file.
In the windows files explorer, I have anycodings_visual-studio-2019 double-checked if the libraries are anycodings_visual-studio-2019 installed properly and they have. Next, I anycodings_visual-studio-2019 have added these two lines (by dragging from anycodings_visual-studio-2019 the solution explorer) in _Layout.cshtml anycodings_visual-studio-2019 file, which is found in my Shared Folder.
<environment include="Development"> <link href="~/lib/twitter-bootstrap/css/bootstrap.css" rel="stylesheet" /> <script src="~/lib/jquery/jquery.js"></script> </environment>Note also, my _ViewStart.cshtml file found anycodings_visual-studio-2019 in the Views folder, has the reference to anycodings_visual-studio-2019 this LayoutFile, as I have included these anycodings_visual-studio-2019 lines:
**@{ Layout = "_Layout"; }**Note also, my libman.json file properly anycodings_visual-studio-2019 contains the libraries installed:
**{ "version": "1.0", "defaultProvider": "cdnjs", "libraries": [ { "library": "", "destination": "lib/twitter-bootstrap/" }, { "library": "", "destination": "lib/jquery/" } ] }**My launchsettings.json file displays anycodings_visual-studio-2019 developement :
"profiles": { "IIS Express": { "commandName": "IISExpress", "launchBrowser": true, "environmentVariables": { "ASPNETCORE_ENVIRONMENT": "Development" } }Finally, I have included UseFileServer() anycodings_visual-studio-2019 middleware in Configure method of anycodings_visual-studio-2019 StartUp.cs, (second middleware after anycodings_visual-studio-2019 UseDeveloperExceptionPage Middleware).
In my Index View Page, i have inserted the anycodings_visual-studio-2019 bootstrap classes like: <div anycodings_visual-studio-2019 class="card-deck"> or <div anycodings_visual-studio-2019 class="card m-3"> or <div anycodings_visual-studio-2019 class="card-header">.
Here is the problem: when I run the anycodings_visual-studio-2019 application from VS Studion 2019 (IIS anycodings_visual-studio-2019 Express), I don't see bootstrap classes in anycodings_visual-studio-2019 effect.
I checked the Page Source in Microsoft Edge, anycodings_visual-studio-2019 and i can see my classes in it, for example:
<div class="card m-3"> <div class="card-header"> <h3>Test 3</h3> </div> <img class="card-img-top" src="/images/noimage.jpg" /> <div class="card-footer text-center"> <a href="/Details/3">View</a> <a href="/magazine/edit/3">Edit</a> <a href="/magazine/delete/3">Delete</a> </div> </div>However, when I check the Developer anycodings_visual-studio-2019 Tools-->Console in Microsoft Edge, i see anycodings_visual-studio-2019 the following messages:
*jquery.js:1
Failed to load resource: the server responded with a status of 404 (Not Found)bootstrap.css:1
Failed to load resource: the server responded with a status of 404 (Not Found)*When I hover over bootstrap.css:1, it anycodings_visual-studio-2019 displays //localhost:7183/lib/twitter-bootstrap/css/bootstrap.css
When I try to see this URL anycodings_visual-studio-2019 "//localhost:7183/lib/twitter-bootstrap/css/bootstrap.css" anycodings_visual-studio-2019 on the Edge Browser itself, I get the same anycodings_visual-studio-2019 error : No webpage was found for the web anycodings_visual-studio-2019 address: anycodings_visual-studio-2019 //localhost:7183/lib/twitter-bootstrap/css/bootstrap.css
Same with jquery.js.
On the other hand, I try to view the class anycodings_visual-studio-2019 libraries from the windows folders, I can anycodings_visual-studio-2019 see them.
C:\X\Y\Z\T\SolutionFolder\lib\twitter-bootstrap\css, anycodings_visual-studio-2019 I can see bootstrap.css inside it (and I can anycodings_visual-studio-2019 open and view content in bootstrap.css).
I have checked javascript is enabled in anycodings_visual-studio-2019 Edge.
I have tried to clear cache from Edge and anycodings_visual-studio-2019 even re-install Edge on my machine, with no anycodings_visual-studio-2019 luck. I tried to launch the application in anycodings_visual-studio-2019 Chrome, encountered the same problem !!
What might have gone wrong? Does it have to anycodings_visual-studio-2019 do with EndPoints? Sorry if this might sound anycodings_visual-studio-2019 naive...
I tried to be as detailed as anycodings_visual-studio-2019 possible. Thanks a lot in advance for your anycodings_visual-studio-2019 help.
24
Answers 1 : of ASP.NET MVV Core App: Failed to load resource: the server responded with a status of 404 (Not Found) bootstrap.css:1
OK I raised this question, but I am anycodings_twitter-bootstrap going to answer it as I found the anycodings_twitter-bootstrap solution myself after some careful anycodings_twitter-bootstrap debugging, it might be beneficial to anycodings_twitter-bootstrap others :)
The problem was that I had created an anycodings_twitter-bootstrap EMPTY ASP.NET MVC Core Application in VS anycodings_twitter-bootstrap 2019. When creating a new application anycodings_twitter-bootstrap without Templates, VS does not create a anycodings_twitter-bootstrap wwwroot folder by default, it has to be anycodings_twitter-bootstrap created manually. When adding Client anycodings_twitter-bootstrap Libraries, the client libraries will be anycodings_twitter-bootstrap added in wwwroot folder, if found. Else anycodings_twitter-bootstrap they will be created outside.
It seems the static files were not anycodings_twitter-bootstrap possible to be detected when they were anycodings_twitter-bootstrap not in wwwroot folder.
So I created wwwroot folder myself (via anycodings_twitter-bootstrap Add --> New Folder --> Named it as anycodings_twitter-bootstrap wwwroot and the icon changed anycodings_twitter-bootstrap automatially to one resembling the web). anycodings_twitter-bootstrap Then I removed my client libraries (i.e. anycodings_twitter-bootstrap libman was cleared), deleted the added anycodings_twitter-bootstrap css, js and lib folders, and added the anycodings_twitter-bootstrap client libraries from the Library anycodings_twitter-bootstrap Manager once again.
Finally, I fixed the directories of the anycodings_twitter-bootstrap static files in the layout file.
0
2022-08-03T18:25:14+00:00 2022-08-03T18:25:14+00:00Answer Link
mRahman