Build Sass with dart

Dart Sass provides a stable Sass compiler.
It’s commonly used as sass npm via several JS bundler plugins.

You can also use dart interface directly as CSS build itself has no relationship with Javascript in most cases.

Dart Library section in the official instruction describes comilation procedure with dart script.

Latest compileToResult() version with some options looks like as following:

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

void main(List<String> arguments) {
  var result = sass.compileToResult(arguments[0], style: sass.OutputStyle.compressed, loadPaths: ["node_modules"]);
  new File(arguments[1]).writeAsStringSync(result.css);

You can call this build script as dart compile-sass.dart styles.scss styles.css.

This example specifies common options including minification and npm compatibility.
You can consult the API reference above for details.

Using npm Sass libs

Many Sass libs are integrated with npm toolchains, and often refer other npms by @import @some-lib/dist/index.scss; way.

Sass has no package resolver, so npm install @some-lib is required for this case.
npm fetches dependencies under node_modules/.

compileToResult(loadPaths: ["node_modules"]) option can load this directory structure and can resolve simple npm references.

⁋ Apr 5, 2023↻ Nov 7, 2024
中馬崇尋
Chuma Takahiro