@import Absolute Path in SCSS file in Visual Studio 2013 Web Essentials
<p>I'm migrating a number of Projects from LESS to SCSS/SASS, all under Visual Studio 2013 with Web Essentials.</p>

<p>The only major problem is this: We have many files that use an absolute path like:</p>

<pre><code>@import '/ui/crud/stuff.less';
</code></pre>

<p>Works great in LESS under Web Essentials. Then we go to use that same line in SCSS, and we get an error. We can fix it with a Relative Path:</p>

<pre><code>@import '../../../../ui/crud.stuff.scss';
</code></pre>

<p>But:</p>

<ol>
<li><p>Wow that's ugly, but I'd cope with it if not for</p></li>
<li><p>It's wrong, because in many cases these files are shared across projects, but not always in the same place in the hierarchy, meaning this path has to change project-to-project. So much for sharing the file in a submodule.</p></li>
</ol>

<p>Digging at docs, I end up lost between 2 worlds. <a href="https://github.com/sass/sass/issues/1124" rel="nofollow noreferrer">In pure SCSS land, I find confused bickering about modules</a>. And in <a href="http://vswebessentials.com/features/less" rel="nofollow noreferrer">Web Essentials' docs SCSS/SASS isn't even listed on the website</a>.</p>

<p>There's got to be a way to just get absolute paths working here.</p>

<p><strong>Stuff I've Tried</strong></p>

<pre><code>@import '/ui/crud/stuff.less';
@import '~/ui/crud/stuff.less';
@import './ui/crud/stuff.less';
@import 'ui/crud/stuff.less';
@import 'crud/stuff.less';
</code></pre>

<p>All get the following error from the Web Essentials SCSS compiler.</p>

<p><a href="https://i.stack.imgur.com/AdPbb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AdPbb.png" alt="Compilation Error occurred: file to import not found or unreadable"></a></p>