sass_builder 1.2.0

  • README.md
  • CHANGELOG.md
  • Installing
  • Versions
  • 98

sass_builder

Build Status

Transpile sass files using the build package and the dart implementation of sass.

Attention: Transformer to be Removed

The transformer provided by this package will be deprecated and removed soon. The pub build and pub serve commands are being replaced by build_runner.

Usage

1. Create a pubspec.yaml file containing the following code:

dependencies:
    # update to the latest version
    bootstrap_sass: any
dev_dependencies:
    # update to the latest version
    sass_builder: ^1.0.0
    build_runner: ^0.7.0

2. Create web/main.scss containing the following code:

@import "sub";
@import "package:bootstrap_sass/scss/variables";

.a {
  color: blue;
}

.c {
  color: $body-color;
}

3. Create web/_sub.scss containing the following code:

.b {
  color: red;
}

4. Create web/index.html containing the following code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Sample</title>
    <link rel="stylesheet" href="main.css">
</head>
<body>
<div class="a">Some Text</div>
<div class="b">Some Text</div>
<div class="c">Some Text</div>
</body>
</html>

5. Run pub run build_runner serve and then go to localhost:8080 with a browser and check if the file web/main.css was generated containing:

.b {
  color: red;
}

.a {
  color: blue;
}

.c {
  color: #373a3c;
}

Builder Options

To configure options for the builder see the build_config README.

  • outputStyle: Supports expanded or compressed. Defaults to expanded.

Example:

targets:
  $default:
    builders:
      sass_builder:
        options:
          outputStyle: compressed

Wrapped as a Pub Transformer

To automatically generate .css files when you run pub build or pub serve you can add sass_builder as a transformer in your package.

In your pubspec.yaml add the following code:

dependencies:
  sass_builder ^1.0.0 # update for the latest version
transformers:
- sass_builder

Transformer Options

  • outputExtension: The extension to use for output files. Defaults to .css.
  • outputStyle: Supports expanded and compressed. Defautls to expanded.

Example:

transformers:
- sass_builder:
    outputExtension: .scss.css
    outputStyle: compressed

1.2.0

  • Add option to configure output style. Supports expanded or compressed as provided by the Dart implementation of Sass. Defaults to expanded.
  • Removed dev dependencies that were no longer used.

1.1.5

  • Fix a bug where the class Logger conflicted with sass, causing a crash.

1.1.4

  • Improve warning message when an imported file can not be found.

1.1.3

  • Fix example and documentation
  • Fix import sass files (fix #25)

1.1.2

  • Widen build and build_test dependencies.
  • Update example and add some instructions regarding build_runner.

1.1.1

  • Fixed compatibility with .sass file compilation.
  • Bump sass dependency to ^1.0.0-beta.4.

1.1.0

  • Support the latest version of build_runner.
  • Align the logger name with the package name: sass_builder.
  • Upgrade to build to ^0.11.1.

1.0.1

  • Support the latest version of build_runner.
  • Align the logger name with the package name: sass_builder.
  • Upgrade to build to ^0.10.2+1.

1.0.0

  • Write assets to temporary directory.

0.2.0

  • Upgrade build_runner to version ^0.4.0.

0.1.2

  • Fix #2: keep trying to build removed .scss.

0.1.1

  • Add missing import.

0.1.0

  • Upgrade build to ^0.9.1 and build_runner to ^0.3.2.

0.0.2

  • Recompile main files after editing sub files.

0.0.1

  • First version.

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  sass_builder: "^1.2.0"

2. Install it

You can install packages from the command line:

with pub:


$ pub get

with Flutter:


$ flutter packages get

Alternatively, your editor might support pub get or packages get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:sass_builder/sass_builder.dart';
        
Version Uploaded Documentation Archive
1.2.0 Apr 12, 2018 Go to the documentation of sass_builder 1.2.0 Download sass_builder 1.2.0 archive
1.1.5 Mar 19, 2018 Go to the documentation of sass_builder 1.1.5 Download sass_builder 1.1.5 archive
1.1.4 Feb 16, 2018 Go to the documentation of sass_builder 1.1.4 Download sass_builder 1.1.4 archive
1.1.3 Feb 12, 2018 Go to the documentation of sass_builder 1.1.3 Download sass_builder 1.1.3 archive
1.1.2 Jan 19, 2018 Go to the documentation of sass_builder 1.1.2 Download sass_builder 1.1.2 archive
1.1.1 Jan 18, 2018 Go to the documentation of sass_builder 1.1.1 Download sass_builder 1.1.1 archive
1.1.0 Dec 3, 2017 Go to the documentation of sass_builder 1.1.0 Download sass_builder 1.1.0 archive
1.0.1 Oct 10, 2017 Go to the documentation of sass_builder 1.0.1 Download sass_builder 1.0.1 archive
1.0.0 Sep 28, 2017 Go to the documentation of sass_builder 1.0.0 Download sass_builder 1.0.0 archive
0.2.0+1 Aug 17, 2017 Go to the documentation of sass_builder 0.2.0+1 Download sass_builder 0.2.0+1 archive

All 17 versions...

Analysis

We analyzed this package on Apr 23, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0-dev.49.0
  • pana: 0.10.6

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
95 / 100
Health:
Code health derived from static analysis. [more]
100 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100 / 100
Overall score:
Weighted score of the above. [more]
98
Learn more about scoring.

Platforms

Detected platforms: Flutter, other

Primary library: package:sass_builder/sass_builder.dart with components: io, isolate, build.

Suggestions

  • 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.

  • Maintain an example.

    None of the files in your example/ directory matches a known example patterns. Common file name patterns include: main.dart, example.dart or you could also use sass_builder.dart.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=1.8.0 <2.0.0
barback >=0.15.2 <0.15.2+15 0.15.2+14 0.15.2+15
build >=0.11.1 <0.13.0 0.12.2
build_barback >=0.4.0+2 <0.6.0 0.5.0+3
build_config ^0.2.1 0.2.6+1
logging ^0.11.3 0.11.3+1
package_resolver ^1.0.2 1.0.2
path ^1.4.1 1.5.1
sass ^1.0.0 1.2.1
scratch_space ^0.0.1 0.0.2+1
Transitive dependencies
analyzer 0.31.1 0.31.2-alpha.1
args 1.4.2
async 2.0.6
charcode 1.1.1
cli_util 0.1.2+1
code_transformers 0.5.1+4
collection 1.14.9
convert 2.0.1
crypto 2.0.2+1
csslib 0.14.1
dart2_constant 1.0.1+dart2
front_end 0.1.0-alpha.9 0.1.0-alpha.11
glob 1.1.5
graphs 0.1.1
html 0.13.3
http 0.11.3+16
http_parser 3.1.1
isolate 1.1.0 2.0.0
kernel 0.3.0-alpha.9 0.3.0-alpha.11
meta 1.1.2
package_config 1.0.3
plugin 0.2.0+2
pool 1.3.4
quiver_hashcode 1.0.0
source_maps 0.10.4
source_span 1.4.0
stack_trace 1.9.2
string_scanner 1.0.2
tuple 1.0.1
typed_data 1.1.5
utf 0.9.0+4
watcher 0.9.7+7
yaml 2.1.13
Dev dependencies
build_test >=0.9.1 <0.11.0
test ^0.12.0