seamink:vue-sass

Scss compiler plugin for altruistiq:vue3 maintained by Altruistiq. Uses dart-sass for performance and node-sass-magic-importer to resolve @imports, enabling you to be creative with imports.

Installation

meteor add seamink:vue-sass

Usages

1<style lang="scss">
2  @import './styles/colors';
3
4  .my-class {
5    color: $red;
6  }
7</style>

supports scoped styling as well

1<style lang="scss" scope>
2  @import './styles/colors';
3
4  .my-class {
5    color: $red;
6  }
7</style>

Using imports

Imports are resolved from the root folder, e.g. @import './some/path/to/cssfile.css';

You can also import from node_modules using a tilde, e.g. @import '~some/path/to/a/node/package/cssfile.css';

Notes

This package only compiles scss inside of Vue components. If you use global stylesheets outside of Vue3 components we recommend installing fourseven:scss as well.

This package does not support .sass files