-
Notifications
You must be signed in to change notification settings - Fork 10
[Bug] Sass functions provided to sass loader are getting removed #9
Description
Describe the bug
When providing custom sass functions to the sass-loader options, they are not ending up being provided to sass-loader after you process the options
Steps to reproduce the behavior
Using the following options:
{
name: '@storybook/addon-styling',
options: {
sass: {
sassOptions: {
functions: {
'square-root($num, $unit)'(num, unit) {
const sqrt = Math.sqrt(num.getValue());
return new Sass.types.Number(sqrt, unit.getValue());
}
},
},
},
},
},Expected behavior
Expect to be able to use square-root from within my scss files, however it is not available.
Screenshots and/or logs
After some investigation, it appears that the polyfill for object spread that got put into node_modules\@storybook\addon-styling\dist\cjs\preset\scss\webpack.js seems to not be able to handle correctly applying the object properties.
I ammended my local version of this buildSassLoader within this file to look like
var buildSassLoader = function buildSassLoader(_ref3) {
// .. default content
const obj = {
loader: "sass-loader",
options: _objectSpread(_objectSpread(_objectSpread({
sourceMap: true
}, sassOptions), implementationOptions), additionalData)
};
require('fs').writeFileSync('./output.txt', JSON.stringify({
src: Object.getOwnPropertyNames(sass.sassOptions.functions),
dst: JSON.stringify(obj.options.sassOptions.sassOptions)
}));
return obj;
};Checking the contents of output.txt, I'm given the following:
{
"src": [
"square-root($num, $unit)",
],
"dst": "{\"functions\":{}}"
}So it's correctly found the functions property I provided where I called the library, but it ends up with none of the methods on it
Environment
- OS: [w7]
- Node.js version: [v12.22.0]
- Typescript: 3.9.3
- @storybook/addon-styling: 0.3.1
Additional context
Add any other context about the problem here.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status