feat: automatically use fibers if it is possible

Author: alexander-akait

README.md

@@ -172,7 +172,50 @@ module.exports = {
 Note that when using `sass` (`Dart Sass`), **synchronous compilation is twice as fast as asynchronous compilation** by default, due to the overhead of asynchronous callbacks.
 To avoid this overhead, you can use the [fibers](https://www.npmjs.com/package/fibers) package to call asynchronous importers from the synchronous code path.
 
-To enable this, pass the `Fiber` class to the `sassOptions.fiber` option:
+We automatically inject the [`fibers`](https://github.com/laverdet/node-fibers) package (setup `sassOptions.fiber`) if is possible (i.e. you need install the [`fibers`](https://github.com/laverdet/node-fibers) package).
+
+**package.json**
+
+```json
+{
+  "devDependencies": {
+    "sass-loader": "^7.2.0",
+    "sass": "^1.22.10",
+    "fibers": "^4.0.1"
+  }
+}
+```
+
+You can disable automatically inject the [`fibers`](https://github.com/laverdet/node-fibers) package pass the `false` value for the `sassOptions.fiber` option.
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.s[ac]ss$/i,
+        use: [
+          'style-loader',
+          'css-loader',
+          {
+            loader: 'sass-loader',
+            options: {
+              implementation: require('sass'),
+              sassOptions: {
+                fiber: false,
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
+Also you can pass own the `fiber` value using this code:
 
 **webpack.config.js**
 

src/getSassOptions.js

@@ -21,7 +21,7 @@ function isProductionLikeMode(loaderContext) {
  * @param {string} content
  * @returns {Object}
  */
-function getSassOptions(loaderContext, loaderOptions, content) {
+function getSassOptions(loaderContext, loaderOptions, content, implementation) {
   const options = cloneDeep(
     loaderOptions.sassOptions
       ? typeof loaderOptions.sassOptions === 'function'
@@ -30,6 +30,34 @@ function getSassOptions(loaderContext, loaderOptions, content) {
       : {}
   );
 
+  const isDartSass = implementation.info.includes('dart-sass');
+
+  if (isDartSass) {
+    const shouldTryToResolveFibers =
+      !options.fibers && options.fibers !== false;
+
+    if (shouldTryToResolveFibers) {
+      let fibers;
+
+      try {
+        fibers = require.resolve('fibers');
+      } catch (_error) {
+        // Nothing
+      }
+
+      if (fibers) {
+        // eslint-disable-next-line global-require, import/no-dynamic-require
+        options.fiber = require(fibers);
+      }
+    } else if (options.fibers === false) {
+      // Don't pass the `fiber` option for `sass` (`Dart Sass`)
+      delete options.fiber;
+    }
+  } else {
+    // Don't pass the `fiber` option for `node-sass`
+    delete options.fiber;
+  }
+
   options.data = loaderOptions.prependData
     ? typeof loaderOptions.prependData === 'function'
       ? loaderOptions.prependData(loaderContext) + os.EOL + content

src/index.js

@@ -32,7 +32,7 @@ function loader(content) {
     this.addDependency(path.normalize(file));
   };
 
-  const sassOptions = getSassOptions(this, options, content);
+  const sassOptions = getSassOptions(this, options, content, implementation);
 
   const shouldUseWebpackImporter =
     typeof options.webpackImporter === 'boolean'

test/sassOptions-option.test.js

@@ -175,6 +175,84 @@ describe('sassOptions option', () => {
         expect(stats.compilation.warnings).toMatchSnapshot('warnings');
         expect(stats.compilation.errors).toMatchSnapshot('errors');
       });
+
+      it(`should work with the "fibers" option (${implementationName}) (${syntax})`, async () => {
+        const testId = getTestId('language', syntax);
+        const options = {
+          implementation: getImplementationByName(implementationName),
+          sassOptions: {},
+        };
+
+        if (semver.satisfies(process.version, '>= 10')) {
+          // eslint-disable-next-line global-require
+          options.sassOptions.fibers = require('fibers');
+        }
+
+        const stats = await compile(testId, { loader: { options } });
+        const codeFromBundle = getCodeFromBundle(stats);
+        const codeFromSass = getCodeFromSass(testId, options);
+
+        expect(codeFromBundle.css).toBe(codeFromSass.css);
+        expect(codeFromBundle.css).toMatchSnapshot('css');
+        expect(stats.compilation.warnings).toMatchSnapshot('warnings');
+        expect(stats.compilation.errors).toMatchSnapshot('errors');
+
+        dartSassSpy.mockRestore();
+      });
+
+      it(`should use the "fibers" package if it is possible (${implementationName}) (${syntax})`, async () => {
+        const dartSassSpy = jest.spyOn(dartSass, 'render');
+        const testId = getTestId('language', syntax);
+        const options = {
+          implementation: getImplementationByName(implementationName),
+          sassOptions: {},
+        };
+
+        const stats = await compile(testId, { loader: { options } });
+
+        expect(getCodeFromBundle(stats).css).toBe(
+          getCodeFromSass(testId, options).css
+        );
+
+        if (
+          semver.satisfies(process.version, '>= 10') &&
+          implementationName === 'dart-sass'
+        ) {
+          expect(dartSassSpy.mock.calls[0][0]).toHaveProperty('fibers');
+        }
+
+        expect(stats.compilation.warnings).toMatchSnapshot('warnings');
+        expect(stats.compilation.errors).toMatchSnapshot('errors');
+
+        dartSassSpy.mockRestore();
+      });
+
+      it(`should don't use the "fibers" package when the "fibers" option is "false" (${implementationName}) (${syntax})`, async () => {
+        const dartSassSpy = jest.spyOn(dartSass, 'render');
+        const testId = getTestId('language', syntax);
+        const options = {
+          implementation: getImplementationByName(implementationName),
+          sassOptions: { fibers: false },
+        };
+
+        const stats = await compile(testId, { loader: { options } });
+
+        expect(getCodeFromBundle(stats).css).toBe(
+          getCodeFromSass(testId, options).css
+        );
+
+        if (
+          semver.satisfies(process.version, '>= 10') &&
+          implementationName === 'dart-sass'
+        ) {
+          expect(dartSassSpy.mock.calls[0][0]).not.toHaveProperty('fibers');
+        }
+
+        expect(stats.compilation.warnings).toMatchSnapshot('warnings');
+        expect(stats.compilation.errors).toMatchSnapshot('errors');
+
+        dartSassSpy.mockRestore();
+      });
     });
   });
 });