Skip to content

robbygregory/WebCompiler

 
 

Repository files navigation

Web Compiler

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

Build status

Download the extension at the VS Gallery or get the nightly build

See the changelog for changes and roadmap.

Features

  • Compilation of LESS, Scss and (Iced)CoffeeScript files
  • Saving a source file triggers re-compilation automatically
  • Specify compiler options for each individual file
  • Error List integration
  • MSBuild support for CI scenarios
  • Minify the compiled output
  • Minification options for each language is customizable
  • Shows a watermark when opening a generated file
  • Shortcut to compile all specified files in solution
  • Task Runner Explorer integration
  • Command line interface

Getting started

Right-click and .less, .scss or .coffee file in Solution Explorer to setup compilation.

Compile file

A file called compilerconfig.json is created in the root of the project. This file let's you modify the behavior of the compiler.

Right-clicking the compilerconfig.json file let's you easily run all the configured compilers.

Recompile

Compile on save

Any time a .less, .scss or .coffee file is modified within Visual Studio, the compiler runs automatically to produces the compiled output file.

The same is true when saving the compilerconfig.json file where all configured files will be compiled.

Compile on build / CI support

In ASP.NET MVC and WebForms projects you can enable compilation as part of the build step. Simply right-click the compilerconfig.json file to enable it.

Compile on build

Clicking the menu item will prompt you with information about what will happen if you click the OK button.

Compile on build prompt

A NuGet package will be installed into the packages folder without adding any files to the project itself. thead NuGet package contains an MSBuild task that will run the exact same compilers on the compilerconfig.json file in the root of the project.

Compile all

You can run the compiler on all compilerconfig.json files in the solution by using the keyboard shortcut Shift+Alt+Y or by using the button on the top level Build menu.

Compile all

Task Runner Explorer

Get a quick overview of the files you've specified or execute a compilation directly in Task Runner Explorer.

Task Runner Explorer

You can even set bindings so that compilation happens automatically during certain Visual Studio events, such as BeforeBuild and Project Open.

Task Runner bindings

Error list

When a compiler error occurs, the error list in Visual Studio will show the error and its exact location in the source file.

Error List

Source maps

Source maps are supported for .scss files only for now, but the plan is to have source map support for all languages.

compilerconfig.json

The extension adds a compilerconfig.json file at the root of the project which is used to configure all conmpilation.

Here's an example of what that file looks like:

[
  {
    "outputFile": "output/site.css",
    "inputFile": "input/site.less",
    "minify": {
        "enabled": true
    },
    "includeInProject": true,
    "sourceMap": false,
    "options":{}
  },
  {
    "outputFile": "output/scss.css",
    "inputFile": "input/scss.scss",
    "minify": {
        "enabled": true
    },
    "includeInProject": true,
    "sourceMap": true,
    "options":{}
  }
]

About

Visual Studio extension for compiling LESS and Sass files

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • C# 96.8%
  • Batchfile 1.7%
  • Other 1.5%