ASP.NET Core 2.2 - Manage Client-Side Libraries
Download KH Authenticator

.NET MAUI App for Windows and Android
Online Registration and Authentication
No Password Or Email Address Required!
Certified Providers
KenHaggerty.Com Users Without Passwords Users With Passwords Users Without IdentityThis article will cover updating client libraries. I will assume you have created a new ASP.NET Core 2.2 Razor Pages project. Let's start by creating a libman.json file.
Right click on the project then click Manage Client-Side Libraries. If a libman.json file is not found, it will be created.
Default for new libman.json:
{ "version": "1.0", "defaultProvider": "cdnjs", "libraries": [] }
The new web application template uses 4 libraries: bootstrap, jquery, jquery-validation and jquery-validation-unobtrusive. Bootstrap and jquery-validation have updates available at the time of this article.
libman.json for bootstrap, jquery, jquery-validation and jquery-validation-unobtrusive:
{ "version": "1.0", "defaultProvider": "cdnjs", "libraries": [ { "library": "twitter-bootstrap@4.3.1", "destination": "wwwroot/lib/bootstrap/dist/" }, { "library": "jquery@3.3.1", "files": [ "jquery.min.js", "jquery.js", "jquery.min.map" ], "destination": "wwwroot/lib/jquery/dist/" }, { "library": "jquery-validate@1.19.0", "files": [ "additional-methods.js", "additional-methods.min.js", "jquery.validate.js", "jquery.validate.min.js" ], "destination": "wwwroot/lib/jquery-validation/dist/" }, { "library": "jquery-validation-unobtrusive@3.2.11", "destination": "wwwroot/lib/jquery-validation-unobtrusive/" } ] }
You should verify the updated files by opening each file and checking the version. I had to clean and restore a couple of times with my article project. Right click on libman.json.
You have updated the local libraries, but our production environment settings use CDN links. Open _layout. cshtml in the Pages\Shared folder. The first CDN link is for bootstrap.min.css.
_layout. cshtml > bootstrap.min.css link:
<environment exclude="Development"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" crossorigin="anonymous" integrity="sha256-eSi1q2PG6J7g7ib17yAaWMcrr5GrtohYChqibrV7PBE=" /> </environment>
You not only need to update the href attribute, you must update the integrity hash. Browse twitter-bootstrap CDN library listings. Select 4.3.1/css/bootstrap.min.css > Copy Link Tag with SRI.
Paste the link inside the environment tag.
_layout. cshtml > bootstrap.min.css link with new link:
<environment exclude="Development"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha256-YLGeXaapI0/5IgZopewRJcFXomhRMlYYjugPLSyNjTY=" crossorigin="anonymous" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" crossorigin="anonymous" integrity="sha256-eSi1q2PG6J7g7ib17yAaWMcrr5GrtohYChqibrV7PBE=" /> </environment>
Merge the attributes.
_layout. cshtml > bootstrap.min.css link with new attributes:
<environment exclude="Development"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" integrity="sha256-YLGeXaapI0/5IgZopewRJcFXomhRMlYYjugPLSyNjTY=" crossorigin="anonymous" /> </environment>
The template is already configured for jQuery 3.3.1 jquery.min.js, but you need to update bootstrap.bundle.min.js.
_layout. cshtml > bootstrap.bundle.min.js link with new attributes:
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js" asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js" asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal" integrity="sha256-fzFFyH01cBVPYzl16KT40wqjhgPtq6FFUB6ckN2+GGw=" crossorigin="anonymous"> </script>
There are CDN links in Pages\Shared > _ValidationScriptsPartial.cshtml. Browse jquery-validate CDN library listings. Select 1.19.0/jquery.validate.min.js > Copy Link Tag with SRI.
_ValidationScriptsPartial.cshtml > jquery-validate link with new attributes:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js" asp-fallback-src="~/lib/jquery-validation/dist/jquery.validate.min.js" asp-fallback-test="window.jQuery && window.jQuery.validator" integrity="sha256-bu/BP02YMudBc96kI7yklc639Mu4iKGUNNcam8D2nLc=" crossorigin="anonymous"> </script>
If you are using Individual User Accounts, you need to scaffolded the Identity UI. There are CDN links in Identity\Pages > _ValidationScriptsPartial.cshtml. The jquery.validation.unobtrusive version is 3.2.9 but we have the updated links from Pages\Shared > _ValidationScriptsPartial.cshtml. Copy and paste both updated links to Identity.
Comments(0)