_Layout.cshtml file fails when attempting to render the bootstrap 5 script bundle (works for earlier versions of bootstrap)
Bundle.Config File
_Layout Debugging
Scripts Folder
I think there is a js format issue in new bootstrap.js or bootstrap.bundle.js which causes the parser crash. As @Manoj Salvi commented, Bootstrap 5 can be successfully bundled with: bundles.Add (new Bundle ("~/scripts/core").Include ("~/content/scripts/bootstrap.bundle.min.js"));
In the namespace System.web.Optimization, MVC 5 has the following bundle classes: The browser sends two distinct requests to load two different JavaScript files, MyJavaScriptFile-1.js and MyJavaScriptFile-2.js, in the figure above.
In an ASP.NET MVC project, the BundleConfig class in the App Start folder can be used to generate style or script bundles. This method has a parameter bundle, which is of the type BundleCollection. At the start of the program, all of the bundles created are added to this bundle parameter.
Thus, you can create a bundle of JavaScript files using ScriptBundle. MVC framework invokes BundleConfig.RegisterBundle() method from the Application_Start event in Global.asax.cs file, so that it can add all the bundles into BundleCollection at the starting of an application.
Try changing "new ScriptBundle" to "new Bundle" in your "RegisterBundles" within BundleConfig:
bundles.Add(new Bundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.js"));
I have the same issue after updating bootstrap to the latest (v5.0.2) via Nuget. I see an answer above about changing ScriptBundle to Bundle with minified js. It is not a real solution for this issue. Script bundling is used to minify scripts only on release mode. We need unminified version on debug mode for debugging. So if you are already using minified js, you do not need to add it to bundleconfig.
I tried bundling with both bootstrap.js and bootstrap.bundle.js and got the same exception at script render phase.
I trimmed very long stacktrace as below:
System.NullReferenceException
HResult=0x80004003
Message=Object reference not set to an instance of an object.
Source=WebGrease
StackTrace:
at Microsoft.Ajax.Utilities.JSParser.ParseObjectLiteralProperty(Boolean isBindingPattern)
at Microsoft.Ajax.Utilities.JSParser.ParseObjectLiteral(Boolean isBindingPattern)
at Microsoft.Ajax.Utilities.JSParser.ParseLeftHandSideExpression(Boolean isMinus)
at Microsoft.Ajax.Utilities.JSParser.ParseUnaryExpression(Boolean& isLeftHandSideExpr, Boolean isMinus)
at Microsoft.Ajax.Utilities.JSParser.ParseExpressionList(JSToken terminator)
at Microsoft.Ajax.Utilities.JSParser.ParseMemberExpression(AstNode expression, List`1 newContexts)
at Microsoft.Ajax.Utilities.JSParser.ParseLeftHandSideExpression(Boolean isMinus)
at Microsoft.Ajax.Utilities.JSParser.ParseUnaryExpression(Boolean& isLeftHandSideExpr, Boolean isMinus)
at Microsoft.Ajax.Utilities.JSParser.ParseExpressionStatement(Boolean fSourceElement)
at Microsoft.Ajax.Utilities.JSParser.ParseStatement(Boolean fSourceElement, Boolean skipImportantComment)
at Microsoft.Ajax.Utilities.JSParser.ParseBlock()
at Microsoft.Ajax.Utilities.JSParser.ParseArrowFunction(AstNode parameters)
at Microsoft.Ajax.Utilities.JSParser.ParseLeftHandSideExpression(Boolean isMinus)
at Microsoft.Ajax.Utilities.JSParser.ParseUnaryExpression(Boolean& isLeftHandSideExpr, Boolean isMinus)
I think there is a js format issue in new bootstrap.js or bootstrap.bundle.js which causes the parser crash.
As @Manoj Salvi commented, Bootstrap 5 can be successfully bundled with:
bundles.Add(new Bundle("~/scripts/core").Include("~/content/scripts/bootstrap.bundle.min.js"));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With