How to minify CSS and JavaScript files in Visual Studio 2015

Question

I am building a web application for mobile using visual studio, and I wanted to know how do I minify all my CSS files into one file, and also all my JavaScript to one minified f

Answer 1

It's handled in the bundleconfig.json for asp.net mvc core

Here is full article: https://docs.microsoft.com/en-us/aspnet/core/client-side/bundling-and-minification?view=aspnetcore-2.1&tabs=visual-studio%2Caspnetcore2x

Answer 2

Both extensions mentioned in other answers seem abandoned, but the good thing, Visual Studio has built-on support for npm and Grunt/Gulp tasks - that can "watch" a file, and minify/compile JS, CSS, SASS and everything else you have in your project.

1. Drop a package.json into your project root folder, with Grunt or Gulp added there. Visual Studio will "detect" it and install all the npm packages in the background.
2. Add Gruntfile.js (or Gulpfile if you prefer Gulp) and Visual Studio "task runner" will also detect it automatically.
3. Edit Gruntfile (or Gulpfile) to minify/compile your files (tons of info can be found online) and optinally add a "watcher" too.
4. Under "View - Other Windows - Task Runner" configure these tasks to run on project open.

I wrote a detailed blog post with screenshots and everything, since it can be overwhelming for VS/.NET people to get familiar with npm/grunt/gulp/npm-scripts at first, but it's easy, trust me! I've been there myself.

Answer 3

You can use the Visual Studio 2015 Bundler & Minifier,extention https://visualstudiogallery.msdn.microsoft.com/9ec27da7-e24b-4d56-8064-fd7e88ac1c40 this used to be apart of Web Essentials in previous versions of Visual Studio, but was separated, into it's own extension.

Answer 4

The below link explains a lot better http://blogs.msdn.com/b/rickandy/archive/2012/08/15/adding-web-optimization-to-a-web-pages-site.aspx

http://www.asp.net/mvc/overview/performance/bundling-and-minification