Dart Sass

Dart Sass является основной реализацией Sass, а это значит, что данная реализация получает новые возможности в первую очередь, в отличие от других реализаций. Он быстр, легок в установке, а также он компилируется в нативный JavaScript, что позволяет внедрить его в любые современные процессы разработки. Узнайте больше или помогите с его разработкой на GitHub.

Командная строка

Автономный Dart Sass в командной строке использует молниеносную Dart VM для компиляции ваших стилей. Для установки Dart Sass в командной строке перейдите на страницу Установка. После того, как установите Sass, вы сможете изпользовать его для компиляции файлов:

sass source/index.scss css/index.css

Команда sass --help позволит вам узнать все доступные команды в интерфейсе командной строки.

Библиотека Dart

Вы можете использовать Dart Sass как библиотеку Dart, чтобы получить скорость Dart VM и возможность создавать свои функции и импортеры. Добавьте его в существующий проект:

  1. Установите Dart SDK. Удостоверьтесь, что папка bin находится в переменной PATH.

  2. Создайте файл pubspec.yaml:

name: my_project
dev_dependencies:
  sass: ^1.20.1

  1. Запустите команду pub get.

  2. Создайте файл compile-sass.dart:

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

void main(List<String> arguments) {
  var result = sass.compile(arguments[0]);
  new File(arguments[1]).writeAsStringSync(result);
}
  1. Теперь используйте команду ниже для компиляции:
dart compile-sass.dart styles.scss styles.css
  1. Больше информации в статье writing Dart code (это легко!) и в Sass's Dart API.

JavaScript Library

Dart Sass is also distributed as the pure JavaScript sass package 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:

var sass = require('sass');

sass.render({
  file: scss_filename
}, function(err, result) {
  /* ... */
});

// OR

var result = sass.renderSync({
  file: scss_filename
});

When installed via npm, Dart Sass supports a JavaScript API that aims to be compatible with Node Sass. Full compatibility is a work in progress, but Dart Sass currently supports the render() and renderSync() functions. Note however that by default, renderSync() is more than twice as fast as render(), due to the overhead of asynchronous callbacks.

To avoid this performance hit, render() can use the fibers package to call asynchronous importers from the synchronous code path. To enable this, pass the Fiber class to the fiber option:

var sass = require("sass");
var Fiber = require("fibers");

sass.render({
  file: "input.scss",
  importer: function(url, prev, done) {
    // ...
  },
  fiber: Fiber
}, function(err, result) {
  // ...
});

See Dart Sass's documentation for more information about its JavaScript API.