Compilando Sass com .Net

Posted on by Alex Hiroshi

Há alguns dias eu estava conversando sobre pré-processadores CSS, mais especificamente sobre Sass. Apesar de ter uma preferência maior para o Less e sempre ficar com um pé atrás com pré-processadores, se a tecnologia vai me dar mais produtividade e se for para conhecer novas tecnologias, nunca é demais estudar.

Estudar é tranquilo, mas instalar algumas coisas no Windows é bem chato. Sabendo disso, resolvi procurar alguma coisa que ajudasse na hora de compilar o Sass no Windows. Como sou desenvolvedor .Net, procurei uma solução para compilar direto no site. Encontrei a biblioteca NSass, no próprio site do Sass, que faz isso.

Para instalar, é só executar o comando abaixo no Package Manager Console:

MS DOS
1
PM> Install-Package NSass.Handler

Você pode chamar o método CompileFile(), da classe SassCompiler, para gerar o CSS a partir de um arquivo .scss ou o método Compile() para gerar o CSS de uma string Sass.

C#
1
2
3
4
5
6
7
8
SassCompiler sassCompiler = new SassCompiler();
string cssCompiladoArquivo = sassCompiler.CompileFile(Server.MapPath("~/Content/styles.scss"));
 
string sass = @"
                $linkColor: #999;
                a {color: $linkColor;}
               ";
string cssCompiladoString = sassCompiler.Compile(sass);

Outra solução se você estiver usando bundles para arquivos .css ou .js, você poderá fazer o mesmo com os arquivos .sass. O mais legal é que ele já compila para .css.

Para isso, instale o pacote NSass.Optimization:

MS DOS
1
PM> Install-Package NSass.Optimization

Agora é só registar os seus .scss no BundleConfig e usar no site.

C#
1
2
3
4
5
6
7
8
9
public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new SassBundle("~/bundles/styles").Include(
            "~/Content/styles.scss",
            "~/Content/site.scss"));
    }
}