Simply add the following lines to your
dependencies: sass: any transformers: - sass
After adding the transformer your
.scss files will be automatically transformed to
You need to have Sass installed and available on the path.
You can also pass options to Sass if necessary:
transformers: - sass: executable: /path/to/sass # Sass executable to use compass: true # Include compass line-numbers: true # Include line numbers in output style: compact # Style of generated CSS copy-sources: true # Copy original .scss/.sass files to output directory
You can use SassC instead of normal Sass by specifying executable as 'sassc' (or any path ending with 'sassc'):
transformers: - sass: executable: sassc # or /path/to/sassc
SassC only supports
.scss-files and does not support Compass.
Normally the transformer simply asks Sass to process the primary input files and Sass will then read the dependent inputs from file system. However, if the input files for Sass are themselves produced by other transformers, they might not exist on the file system at all. The normal transformer will not work in those cases.
To work around this problem, you can use
inlined_sass_transformer. It will use Barback's APIs
to read and inline all imports into one big Sass file which it will then pass to Sass.
The downside is that line numbers on error messages and source maps might be incorrect. (See
To enable the use of inlined transformer, use
sass/inlined_sass_transformer as your transformer:
transformers: - sass/inlined_sass_transformer <possible configuration settings>
inlined_sass_transformer. (#4) (Thanks to Dan Schultz.)
sass.batas default executable on Windows. (#10) (Thanks to Nicholas Tuck.)
copy-sources: trueto keep the old behavior. (#7)
DeclaringTransformeron Barback 0.13.x.
DeclaringTransformerinterface so Barback can optimize the asset graph.
Add this to your package's pubspec.yaml file:
dependencies: sass: "^0.4.2+1"
You can install packages from the command line:
$ pub get
$ flutter packages get
Alternatively, your editor might support
pub get or
Check the docs for your editor to learn more.
Now in your Dart code, you can use:
|0.4.2+7||Nov 5, 2016|
|0.4.2+5||Nov 5, 2016|
|0.4.2+4||Oct 20, 2016|
|0.4.2+3||Oct 20, 2016|
|0.4.2+2||Oct 19, 2016|
|0.4.2+1||Oct 19, 2016|
|0.4.2||Nov 3, 2014|
|0.4.1||Oct 9, 2014|
|0.4.0||Sep 22, 2014|
|0.3.2||Sep 17, 2014|
We analyzed this package, and provided a score, details, and suggestions below.
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Detected platforms: Flutter, other
The description is too short.
Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.
Package is pre-v1 release.
While there is nothing inherently wrong with versions of
0.*.*, it usually means that the author is still experimenting with the general direction API.
Maintain an example.
Create a short demo in the
example/directory to show how to use this package. Common file name patterns include:
example.dartor you could also use