Scripts bundle error caused by Bootstrap 5.x in .net mvc application
I recently updated my installed packages from nuget to work with the latest packages, but my .net application stopped working by throwing ‘object reference not set to an instance of an object’. It was displaying the red coloured text indicating the error line which was pointing to the ‘scripts’ bundle. But it was not indicating the actual cause of the error and which package was creating this issue.
This issue was caused by the Bootstrap package update from bootstrap version 4.x to 5.x. And reason behind the error was script files like ‘jquery’ and ‘bootstrap’ were included in the same bundle in bundle.config file as shown below:var scriptBundle = new ScriptBundle("~/Scripts/bundle");
// jQuery
scriptBundle.Include("~/Scripts/jquery-3.5.1.min.js");
.......
// Bootstrap 4.x
scriptBundle.Include("~/Scripts/bootstrap.js");
Creating a separate bundle for solves the issue:
var scriptBundle = new ScriptBundle("~/Scripts/bundle");
varbootstrapBundle = new ScriptBundle("~/Scripts/bootstrapBundle");
// jQuery
scriptBundle.Include("~/Scripts/jquery-3.6.0.min.js");
.....
// Bootstrap 5.x
bootstrapBundle
.Include("~/Scripts/bootstrap.js");
If it does not resolves the issue, try using Bundle instead of ScriptBundle
var bootstrapBundle = new Bundle(“~/Scripts/bootstrapBundle”);
Webner Solutions is a Software Development company focused on developing Insurance Agency Management Systems, Learning Management Systems and Salesforce apps. Contact us at dev@webners.com for your Insurance, eLearning and Salesforce applications.
Originally published at https://blog.webnersolutions.com on October 4, 2021.
