Visual Studio Browser Link + Chrome Developer Tools

Question

My Visual Studio 2013 app uses LESS, which is bundled using BundleTransformer (http://bundletransformer.codeplex.com). LESS files are imported across the entire app into a single app.less. This app.less file is then bundled.

// Bundles
using BundleTransformer.Less;
...
var cssBundle = new Bundle("~/bundles/less");
cssBundle.Include("~/content/less/app.less");

With this method, Chrome (and every other browser) only sees the final app.less. When I open Chrome Developer tools and make a change to the CSS on the fly, Browser Link automatically saves the changes back to app.less. The original app.less, which looked something like the below is now the entire compiled version the browser loaded.

// app.less
@import "bootstrap/bootstrap.less";
@import "app/common/layout/header.less";
@import "app/common/layout/footer.less";

1) How do I prevent Browser Link from automatically saving? I've turned off the "Enable F12 Save Changes" option, but it doesn't care. Or disable saving of LESS files only, as I do modify Javascript in Chrome Developer tools often and wish to save.

2) If I do want to save (which I do), is there a way to configure my app, BundleTransformer, and/or my browser (Chrome) to map to the original source files (during development), instead of the compiled app.less?

I'm also using Web Essentials 2013 (1.8.5), but just for viewing LESS in VS.

Chrome is mapped to my apps workspace. https://developers.google.com/chrome-developer-tools/docs/settings#workspace

Answer 1

Disable VS BrowserLink

  <appSettings>
   <add key="vs:EnableBrowserLink" value="false"/>
</appSettings>