How to use common Layout and styles across multiple Asp.net MVC applications

Question

I have a visual studio solution with multiple telerik MVC4 razor projects having same look and feel. I don't want to have same layout, CSS/styles, images and js files copied in all MVC4 projects. What is the best way to accomplish this re-usability? I tried creating a virtual directory of a commonUI project and tried to refer _layout.cshtml using http://localhost/... in _ViewStart.cshtml but it complained saying "http:/localhost/MyMvcApp/Views/Shared/_Layout.cshtml' is not a valid virtual path."

Please help!

Camembert

Answer 1

Four recommendations:

1) Look into areas, maybe instead of having separate projects these are really different components of the same system (admin, etc.)?

2) Use add existing item in visual studio and add the items via links. This still duplicates them for deployment, but you can keep one source.

3) Consider doing this by building your own nuget package. That way although you would copy the CSS and images you would have it packaged up and could update the package as needed. The benefit is that you can update one project while not having to re-test the other (if they are separate and 1) doesn't apply).

4) I find this one uglier than the rest, but in IIS I believe you can map in folders, so you could refer to these files by links in your project, not deploy them there and then map in the appropriate folder at deployment time using a single source path.

I know of no way to share up the application path.

EDIT:

I have never tried this before, so can't vouch for it working, but maybe compile your shared items in a separate project and then reference the DLL in all other projects.

The reference I found is this, but again, I haven't confirmed that this works, just think this could be a viable path to explore:

http://www.chrisvandesteeg.nl/2010/11/22/embedding-pre-compiled-razor-views-in-your-dll/

Alben

I cannot use the areas because my web projects are actually 3 different projects and not components (admin etc.) They just share common Entities and database. They are meant to be used by different group of users. 2) Still duplicates them on deployment as you mentioned. – Camembert

I will have to look more into option 3 and 4. Thanks anyway. – Camembert

Amit, I don't have time to try this at the moment, but if you feel strongly about getting this to work, maybe try my edit approach – Alben

Thanks Mirko. I will give it a try tomorrow. Got busy with other stuff lately. – Camembert

I know usually I like to confirm things before I post, but this wasn't a quick thing to check, so I got lazy and just sent the pointer :) – Alben

Mirko, The solution in the link helped me fix the issue partially. Thanks. – Camembert

Very nice answer! Just to make it more complete, I found Portable Areas useful. It is part of MvcContrib. – Izettaizhevsk

Answer 2

Areas are bad because you cannot deploy them separately. Like you, I tried using virtual directories, and was successful referring to the layouts using relative syntax:

@{
    Layout = "~/Common/Layouts/Layout-001.cshtml";
}

Above, the project's layout inherits the layout in the /common/ virtual directory at the root. As the common layout (along with it's bootstrap & jquery versions) evolve, you can use side-by-side version-named physical folders (like common.v01, common.v02,). So you can upgrade your applications to a newer common layout by changing the VD's path to the appropriate version.

The downside with this is you'll need to use IIS (not express) as your dev and test platform.

Sylph