sass-site/old_source/dart-sass.html.haml

---
title: Dart Sass
no_container: true
introduction: >
  Dart Sass is the primary implementation of Sass, which means it gets new
  features before any other implementation. It's fast, easy to install, and it
  compiles to pure JavaScript which makes it easy to integrate into modern web
  development workflows. Find out more or help out with its development on
  [GitHub](https://github.com/sass/dart-sass).
---

.sl-l-grid.sl-l-grid--full.sl-l-large-grid--fit.sl-l-large-grid--gutters-large
  .sl-l-grid__column
    :markdown
      ## Command Line

      Dart Sass's stand-alone command-line executable uses the blazing-fast Dart
      VM to compile your stylesheets. To install Dart Sass on the command line,
      check out the #{link_to "installation instructions", "/install"}. Once
      you've got it running, you can use it compile files:

      ```sh
      sass source/index.scss css/index.css
      ```

      See `sass --help` for additional information on the command-line
      interface.

      ### Dart Library

      You can also use Dart Sass as a Dart library to get the speed of the Dart
      VM plus the ability to define your own functions and importers. To add it
      to an existing project:

      1. [Install the Dart SDK][install]. Make sure its `bin` directory is [on
         your `PATH`][path].

         [install]: https://www.dartlang.org/install#automated-installation-and-updates
         [path]:    https://katiek2.github.io/path-doc/

      2. Create a `pubspec.yaml` file like this:

         ```yaml
      name: my_project
      dev_dependencies:
        sass: ^#{impl_version(:dart)}
         ```

      3. Run `dart pub get`.

      4. Create a `compile-sass.dart` file like this:

         ```dart
      import 'dart:io';
      import 'package:sass/sass.dart' as sass;

      void main(List<String> arguments) {
        var result = sass.compileToResult(arguments[0]);
        new File(arguments[1]).writeAsStringSync(result.css);
      }
         ```

      5. You can now use this to compile files:

         ```sh
      dart compile-sass.dart styles.scss styles.css
         ```

      6. Learn more about [writing Dart code][dart] (it's easy!) and about
         [Sass's Dart API][sass].

         [dart]: https://www.dartlang.org/guides/language/language-tour
         [sass]: https://pub.dev/documentation/sass/latest/sass/compileToResult.html

  .sl-l-grid__column
    :markdown
      ## JavaScript Library

      Dart Sass is also distributed as the pure JavaScript [`sass`
      package](https://npmjs.com/package/sass) on npm. The pure JS version is
      slower than the stand-alone executable, but it's easy to integrate into
      existing workflows and it allows you to define custom functions and
      importers in JavaScript. You can add it to your project using
      `npm install --save-dev sass` and `require()` it as a library:

      ```js
      const sass = require('sass');

      const result = sass.compile("style.scss");
      console.log(result.css);

      // OR

      const result = await sass.compileAsync("style.scss");
      console.log(result.css);
      ```

      When installed via npm, Dart Sass supports a [brand new JavaScript API],
      as well as a [legacy API] that's fully compatible with the old Node Sass
      API. Note that when using the `sass` package, the synchronous API functions
      are more than twice as fast as the asynchronous API, due to the overhead
      of asynchronous callbacks.

      [brand new JavaScript API]: https://sass-lang.com/documentation/js-api/
      [legacy API]: https://sass-lang.com/documentation/js-api/#legacy-api