Manage jQuery in IE8 with bower

Here’s a quick way of using up to date jQuery whilst still supporting IE8.

In ASP.NET MVC Razor

    <!--[if IE 8 ]>
    @Scripts.Render("~/bower_components/jquery-legacy/dist/jquery.min.js")
    <![endif]-->
    <!--[if (gt IE 9)|!(IE)]>
    @Scripts.Render("~/bower_components/jquery-modern/dist/jquery.min.js")
    <![endif]-->

In your bower.json

    "dependencies": {
      "bootstrap": "~3.3.5",
      ...,
      "jquery-legacy": "jquery#^1",
      "jquery-modern": "jquery#^2"
    }

Why should I use Bower?

What is Bower?

Bower is a package manager for front-end frameworks.

Why should I use Bower?

It’s arguably simpler to use Bower as your package manager for front-end development than to use NuGet.

• It can create a bower.json file that lists all of your dependencies.
• It’s easily driven from the command line.
• It separates out the concerns of the front-end from those of the back-end.

Of great benefit is it’s a single point of access to thousands of front-end packages that just aren’t available as NuGet packages. Previously you would have had to download and install the Javascript and the CSS. The process would have varied from project to project and there was no obvious upgrade path to the latest versions.

Starting with ASP.NET 5.0 there will be no more NuGet packages for front-end frameworks like Twitter Bootstrap. Microsoft currently create these packages using Bower but will now be expecting you to tool up with Bower yourself. Might as well get started early.

How do I use Bower?

This gets a bit gnarly, mainly because we’re behind a corporate proxy that expects authentication and tools like npm and bower aren’t clued up about that. You need to set up a proxy server locally to handle NTLM authentication. I’ve been successful with CNTLM.

• set up CNTLM
• install node (.msi)
• set up .npmrc
• $ npm install -g npm
• ensure %appdata%\npm is before %ProgramFiles%\nodejs in the PATH
  (npm wiki: upgrading-on-windows)
• $ npm install -g bower
• set up .bowerrc
• $ bower install bootstrap

You can now reference your bower_components directly from your includes or you can configure a Gulp/Grunt build.

Where do I find out more?

Bower
Introducing Gulp, Grunt, Bower, and npm support for Visual Studio