How do I make linked images in my web project appear on my local dev web server?

Question

I've recently become involved (or rather, re-involved) in a web project I originally wrote in 2000 in ASP. Over the last 13 years, the project has evolved and become quite convoluted both in the technology uses (ASP, ASP.NET 1.1, ASP.NET 3.5 and ASP.NET 4.0). We are now working in VS 2010.

There are multiple distinct web-applications nested in the same tree. Each of these projects has it's own styles and images folder, leading to a lot of redundancy of images and css files, which is driving our GUI developer somewhat crazy trying to keep them all straight.

I'm trying to clean the mess up. My intention is to consolidate these redundant resources into a single "core" project folder. I want other projects which live further down the tree to link these files into their projects instead of having copies of them.

I've been able to accomplish this by editing the downstream web project and adding the following:

  <ItemGroup>
    <Content Include="..\..\Core\XXXXX.XXXXX.ASP.Web\Images\**\*.*">
      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
      <Link>images\%(RecursiveDir)%(FileName)%(Extension)</Link>
    </Content>
  </ItemGroup>

This results in the images being linked in and it LOOKS proper:

And when I build the project, the files do end up in the bin folder:

We use nant to build our projects for release, and I can ensure the images are included in the release copy by updating my copy task, so no problem there.

But when I run the project locally, the images refuse to appear in the web page (localhost instance):

It SHOULD look like (Dev server instance):

It's not mission critical of course - but it's nevertheless really annoying to run the project locally and not see the images and thus the page layout as it's intended to be.

How can I make these linked images show up locally?

Answer 1

You might want to use a handler and/or rewrite the images paths bases on the environment instead of copying the images around.