How to use SaSS for an ASP.NET MVC application?

You can use another way easier I think.

Step 1

Go with this steps in your NuGet Manager.

  1. Add Microsoft.AspNet.Web.Optimization

  2. Add BundleTransformer.SassAndScss

  3. Add LibSassHost.Native.win-x64 if you use system 64 bit.

  4. LibSassHost.Native.win-x86

Step2

In BundleConfig.cs add this code in RegisterBundles methode.

var nullBulider = new NullBuilder();
var nullOrderer = new NullOrderer();

BundleResolver.Current = new CustomBundleResolver();
var commonStyleBundle = new CustomStyleBundle("~/Bundle/sass");

commonStyleBundle.Include("~/css/main.scss");
commonStyleBundle.Orderer = nullOrderer;
bundles.Add(commonStyleBundle);

Step 3

Add CSS folder in your project and add main.scss file sheet inside.

Step 4

In your view, you need to use System.Web.Optimization.

@using System.Web.Optimization

And link your style sheet

@Styles.Render("~/Bundle/sass").

Step 5

In Global.asax we need to add this line in Application_Start().

RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);

Or maybe you will find it already in your class if you use MVC templet.

And that is it your main.scss its work.


Try Web Compiler plugin instead this is what I use to compile SCSS in MVC.

A Visual Studio extension that compiles LESS, Sass, JSX, ES6 and CoffeeScript files.