title: Howto configure gulp-sass compiler to use dart-sass in gulpfile.babel.js?
body: <p><strong>How to set the <code>sass.compiler</code> property to use Dart Sass instead of Node Sass, when you are using <code>gulpfile.babel.js</code> configuration file, instead of standard <code>gulpfile.js</code>?</strong></p>
  <p>The latest gulp-sass documentation states:<br>
  &quot;You can choose whether to use Dart Sass or Node Sass by setting the sass. compiler property.&quot;</p>
  <p>To use node-sass we need to declare this for a <code>gulpfile.js</code>:</p>
  <pre><code>'use strict';
  
  var gulp = require('gulp');
  var sass = require('gulp-sass');
  
  sass.compiler = require('node-sass');
  </code></pre>
  <p>Therefore to use dart-sass we need to declare this for a <code>gulpfile.js</code>:</p>
  <pre><code>'use strict';
  
  var gulp = require('gulp');
  var sass = require('gulp-sass');
  
  sass.compiler = require('dart-sass');
  </code></pre>
  <p>When I compared the difference between the produced compressed CSS files via both &quot;Ruby Sass 3.7.3&quot; and &quot;gulp-sass 4.0.2&quot; it turned out quite a difference between the file sizes.</p>
  <p><em>This is due to some differences during compilation such as:</em><br></p>
  <p>the Ruby one converts <code>.1em</code> to: <code>0.1em</code><br>
  while<br>
  the gulp one is keeping the <code>0.1em</code><br></p>
  <p>and<br></p>
  <p>the Ruby one converts codes such as <code>\f008</code> to <code></code><br>
  while<br>
  the gulp one is keeping those codes as they are</p>
  <p>plus some other bits and bobs.. overall I would like to use the ruby conversions via gulp. I hope that using gulp-sass with dart-sass compiler might be a better solution for my current particular needs.</p>
  <blockquote>
  <p><strong>Ruby Sass 3.7.3</strong> can be found here: <a href="https://rubygems.org/gems/sass/versions/3.7.3" rel="nofollow noreferrer">https://rubygems.org/gems/sass/versions/3.7.3</a></p>
  <p><strong>latest gulp-sass</strong> can be found here: <a href="https://github.com/dlmanning/gulp-sass" rel="nofollow noreferrer">https://github.com/dlmanning/gulp-sass</a></p>
  <p><strong>latest dart-sass</strong> can be found here: <a href="https://github.com/sass/dart-sass" rel="nofollow noreferrer">https://github.com/sass/dart-sass</a></p>
  </blockquote>
  <p>Currently, I am using this in my <code>gulpfile.babel.js</code>:</p>
  <pre><code>import gulp from 'gulp';
  import print from 'gulp-print';
  import concat from 'gulp-concat';
  import sass from 'gulp-sass';
  import uglify from 'gulp-uglify';
  import notify from 'gulp-notify';
  import size from 'gulp-size';
  import fileSize from 'gulp-filesize';
  </code></pre>