Dart Sass

Dart Sass は Sass の主要な実装であり、他の実装よりも先に新機能が追加されます。高速でインストールが容易であり、純粋な JavaScript にコンパイルされるため、最新の Web 開発ワークフローへの統合が容易です。詳細情報や開発への参加については、GitHubをご覧ください。

コマンドラインコマンドライン パーマリンク

Dart Sass のスタンドアロンのコマンドライン実行ファイルは、高速な Dart VM を使用してスタイルシートをコンパイルします。コマンドラインに Dart Sass をインストールするには、インストール手順をご覧ください。実行可能になったら、これを使用してファイルをコンパイルできます。

sass source/index.scss css/index.css

コマンドラインインターフェースの詳細については、sass --help を参照してください。

Dart ライブラリDart ライブラリ パーマリンク

Dart Sass を Dart ライブラリとして使用して、Dart VM の速度と、独自の関数やインポーターを定義する機能を利用することもできます。既存のプロジェクトに追加するには

  1. Dart SDK をインストールします。その bin ディレクトリが PATH に含まれていることを確認してください。

  2. 次のような pubspec.yaml ファイルを作成します。

name: my_project
dev_dependencies:
  sass: ^1.79.4

  1. dart pub get を実行します。

  2. 次のような compile-sass.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);
}
  1. これで、これを使用してファイルをコンパイルできます。
dart compile-sass.dart styles.scss styles.css

  1. Dart コードの記述方法（簡単です！）とSass の Dart APIの詳細については、こちらをご覧ください。

JavaScript ライブラリJavaScript ライブラリ パーマリンク

Dart Sass は、npm の純粋な JavaScript sass パッケージ と sass-embedded パッケージ として配布されています。純粋な JS バージョンはスタンドアロンの実行ファイルよりも低速ですが、既存のワークフローへの統合が容易であり、JavaScript でカスタム関数とインポーターを定義できます。npm install --save-dev sass を使用してプロジェクトに追加し、ライブラリとして require() できます。

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);

npm 経由でインストールされた場合、Dart Sass はまったく新しい JavaScript APIと、古い Node Sass API と完全に互換性のあるレガシー API をサポートしています。sass パッケージを使用する場合、非同期コールバックのオーバーヘッドのため、同期 API 関数は非同期 API よりも 2 倍以上高速です。

組み込み Dart Sass組み込み Dart Sass パーマリンク

Dart Sass は、組み込み Sass プロトコルもサポートしています。これにより、任意のプログラミング言語が Dart VM と直接通信して Sass のコンパイルを実行し、カスタム関数とインポーターのサポートを含めることができます。これには、2 つの大きな利点があります。

  1. サブプロセスを実行できる任意のプログラミング言語で Dart Sass のラッパーライブラリを簡単に作成できます。

  2. Dart VM は非常に高速であるため、ネイティブの sass パッケージが利用可能な JavaScript でも、大幅なパフォーマンス向上を実現できます。

以下の組み込み Sass ラッパーパッケージが利用可能です。追加するパッケージがある場合は、プルリクエストを送信してください！