Question

I have an existing project and on new pages I’d like to include new versions of JavaScript libraries without breaking other pages if the libraries are not backward compatible.

What is the best way of achieving this? I’d like to be able to set a variable like: useBootStrapCss2 or something similar to use the new libraries.

At the moment the libraries are included by using a shared partial which is included in the main shared layout page (named Assets).

The problem I foresee is, if the variable is set at the top of the view, the variable won’t be in scope inside the shared view so won’t be able to switch to use the correct Assets partial.

Answer 1

To be honest I wouldn’t go the route of having variables set to switch versions of script. That will probably get really messy in the long run.

You have a couple of clean(er) options.

Create a separate Layout, basically a clone of your first layout, but with the updated scripts. Use this layout for your new pages, while slowly migrating existing pages over.

This option avoids the headache of conditional logic, but… it now means you have two layout pages to maintain. This may not be a big deal, but if the old layout will live for a long time it might be a bad idea.

Create a content area on your layout page with default content.

@if (IsSectionDefined("ScriptReferences")){   
    @RenderSection("ScriptReferences")   
}   
else {  
    <script src="blah.js"></script>  
}

This is a pretty flexible option and allows you to override on a per-page basis. There may be other options, but these are the best I can think of off the top of my head.