.NET Tips and Tricks

Blog archive

Bundling Scripts in ASP.NET Core

In ASP.NET MVC Core the BundleConfig class -- where, in ASP.NET MVC, you used code to create script bundles in ASP.NET MVC -- is gone. Instead, you use a configuration file called bundleconfig.json to name your bundles and assign files to them.

This sample code combines two JavaScript files into a bundle called site.min.js (it also triggers minifying all the files added to the bundle):

[
  {
    "outputFileName": "wwwroot/js/site.min.js",
    "inputFiles": 
     [
       "wwwroot/js/jquery.js",
       "wwwroot/js/Customers.js",
     ],
     "minify": 
     {
       "enabled": true,
       "renameLocals": true
     },
  }
]

If you don't want to put in every file individually, you can use globbing patterns to gather up the files you want. This example gets every JavaScript file in the wwwroot/js folder that isn't already marked as minified:

"inputFiles": [
		"wwwroot/js/*(*.js|!(*.min.js))"]

Finally you just need put a script tag that refers to your bundle into your page:

<script href="~/js/site.min.js"></script>

Posted by Peter Vogel on 01/10/2019


comments powered by Disqus

Featured

Subscribe on YouTube