Using new "Compass install path" feature. Bombs on linear-gradient.

Versions involved:

• Web Workbench 3.0.92.19988
• Compass 0.11.7

I'm using the new "Compass install path" feature and I have the following line of Sass:

@include linear-gradient(color-stops($red, darken($red, 8%)), top);

But when Web Workbench tries to compile, I get the following error:

System.MissingMethodException: undefined method `name' for #<NoMethodError: undefined method `gt' for "-compass-list-size(compact(false, linear-gradient(top, color-stops(#b20838, #8b062c)), false, false, false, false, false, false, false, false))":Sass::Script::String>

If I comment out that linear-gradient include and then save to re-compile, I get a similar error for the next linear-gradient include in the stylesheet. After I have commented out all linear-gradient includes, it compiles just fine.

Also, I'm using other Compass includes (border-radius and box-shadow) and they work correctly. I.e., it's not all of Compass that's failing, just linear-gradient (as far as I know).

Unfortunately we're not yet able to compile Compass stylesheets. As you've found, some of them do work, but many don't (specifically ones which use custom Sass functions, which I think is what color-stops is). So as mentioned in the blog post, you'll still need to run the Compass compiler yourself to do this. All we've tried to do in this release is to improve the editing experience for Compass SCSS files, e.g. by being aware of variables and mixins imported from Compass. For files that import Compass stylesheets, we advise turning off Web Workbench compilation and instead running the Compass compiler either in watch mode or as a pre- or post-build step in VS.

We know a lot of people are keen for full Compass integration and it's definitely on our radar, but I'm afraid that Compass compilation is just something we haven't yet been able to find the resources for.

Hope this clarifies where we're at, and we do appreciate the feedback!

FWIW, this is how I ended up using Compass.

Turn off Mindscape compilation of my scss files

Install Ruby (I installed it straight into a _build/Ruby folder in my solution folder so it would be checked in and available for all developers including the build server)

Install Compass

In my web project I created a compass.cmd which adds the Ruby bin folder to the path, then runs the compass commands.

@ECHO OFF
REM Adds _build\Ruby\bin to the path, then runs compass.bat from that folder
SETLOCAL
SET PATH=%PATH%;%~dp0..\_build\Ruby\bin
compass.bat %*

Created compass-watch.cmd:

@compass watch --time

Created compass-compile.cmd:

@compass compile --time

Created compass-clean.cmd:

@compass clean

Modified my web project csproj to run compass-compile as a build step:

<Target Name="GetCompilableScssFiles">
  <ItemGroup>
    <CompilableScss Include="@(None)" Exclude="**/_*" Condition="('%(Extension)' == '.scss')">
      <Dest>%(RootDir)%(Directory)%(Filename).css</Dest>
    </CompilableScss>
    <AllScss Include="@(None)" Condition="('%(Extension)' == '.scss')" />
  </ItemGroup>
</Target>
<Target Name="FailIfScssCompiledByMindscape" DependsOnTargets="GetCompilableScssFiles">
  <Error Text="You must uncheck the COMPILE option in the Mindscape WebWorkbench options for '%(AllScss.FullPath)'" Condition="'%(AllScss.Compile)' != 'False'" />
</Target>
<Target Name="CompileScss" AfterTargets="AfterBuild"  DependsOnTargets="FailIfScssCompiledByMindscape;GetCompilableScssFiles" Condition="('$(CdisLibraryType)' == 'MVC3')" Inputs="@(AllScss)" Outputs="@(CompilableScss -> '%(Dest)')">
  <!-- Note the CustomErrorRegularExpression so we can treat "warnings as errors" -->
  <Exec Command="compass-compile" CustomErrorRegularExpression=".*WARNING.*" />
  <!-- If build was successful, then touch all output css files even if the compass compile command did not compile some of them.  This will prevent msbuild from thinking the css files are not up to date -->
  <Touch Files="@(CompilableScss -> '%(Dest)')" AlwaysCreate="false" />
</Target>
<Target Name="CleanScss" AfterTargets="AfterClean" DependsOnTargets="GetCompilableScssFiles" Condition="('$(CdisLibraryType)' == 'MVC3')">
  <Exec Command="compass-clean" />
</Target>

This sets things up so that the scss files are automatically compiled by the Compass compiler whenever the web project is built. It also kicks out an error if you accidentally forget to turn off the Mindscape compiler for any of your scss files. It also gives a handy compass-watch.cmd file that you can run straight from the Solution Explorer if you've setup Visual Studio to run .cmd files. This satisfies the developer need for quick interactive compilation.

Finally, I actually placed Ruby+Compass within my solution folder and checked it into source control so that it would be available for everyone (all team members + the build server) without them needing to go through this installation process.

I hope this helps.