Sass parser in JavaScript. This is a convenience API for the emscripted libsass. If you're looking to run Sass in node, you're probably looking for node-sass
A fair warning: minified it's 2MB, gzipped it's 550KB.
see the live demo
- compile styles
nested,expandedandcompactseem to behave exactly the same - compile style
compressedprefixes every selector with&
(We haven't looked into why this is happening yet)
Sass.js comes in two flavors – the synchronous in-document sass.js and the asynchronous worker sass.worker.js. The primary API - wrapping the Emscripten runtime - is provided with sass.js (it is used internally by sass.worker.js as well). sass.worker.js mimics the same API (adding callbacks for the asynchronous part) and passes all the function calls through to the web worker.
<!-- loading libsass.js and sass.js into your document -->
<script src="src/libsass.js"></script>
<script src="src/sass.js"></script>
<script>
var scss = '$someVar: 123px; .some-selector { width: $someVar; }';
var css = Sass.compile(scss);
console.log(css);
</script>Warning: src/libsass.js will litter your global scope with Emscripten's runtime. It's great for debugging, but you really want to use sass.worker.js.
<!-- loading libsass.worker.js and sass.worker.js into your document -->
<script src="src/sass.worker.js" data-libsass-worker="src/libsass.worker.js"></script>
<script>
var scss = '$someVar: 123px; .some-selector { width: $someVar; }';
Sass.compile(scss, function(css) {
console.log(css);
});
</script>Chances are you want to use one of the readily available Sass mixins (e.g. drublic/sass-mixins or Burbon). While Sass.js doesn't feature a full-blown "loadBurbon()", registering files is possible:
Sass.writeFile('one.scss', '.one { width: 123px; }');
Sass.writeFile('some-dir/two.scss', '.two { width: 123px; }');
Sass.compile('@import "one"; @import "some-dir/two";');outputs
.one {
width: 123px; }
.two {
width: 123px; }//TODO: proper API documentation
Sass.compile(text);
Sass.options({
style: Sass.style.nested,
comments: Sass.comments.none
});
Sass.writeFile(filename, text);
Sass.removeFile(filename);
Sass.readFile(filename);
Sass.listFiles();Sass.js is - as libsass and Emscripten are - published under the MIT License.