Skip to content

Commit

Permalink
feat: automatically use the fibers package if it is possible
Browse files Browse the repository at this point in the history
  • Loading branch information
alexander-akait committed Aug 23, 2019
1 parent ac14fd5 commit 88c1648
Show file tree
Hide file tree
Showing 11 changed files with 551 additions and 4 deletions.
45 changes: 44 additions & 1 deletion README.md
Expand Up @@ -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**

Expand Down
29 changes: 28 additions & 1 deletion src/getSassOptions.js
Expand Up @@ -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'
Expand All @@ -30,6 +30,33 @@ function getSassOptions(loaderContext, loaderOptions, content) {
: {}
);

const isDartSass = implementation.info.includes('dart-sass');

if (isDartSass) {
const shouldTryToResolveFibers = !options.fiber && options.fiber !== 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.fiber === 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
Expand Down
2 changes: 1 addition & 1 deletion src/index.js
Expand Up @@ -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'
Expand Down

0 comments on commit 88c1648

Please sign in to comment.