SCSS isn't compiled to css in storybook

I am building a reusable component library with react + storybookui, but the .scss files aren't compiled to css, a I can see the scss specific keywords e.g (@extend, and $variable) on the inspector tool NB: I have tried both approach of compiling using (@storybook/preset-scss), and manually adding

config.module.rules.push({
   test: /\.scss$/,
   use: ["style-loader", "css-loader", "sass-loader"],
   include: [path.resolve(__dirname, "../")
})

to the webpackFinal property in .storybook/main.js exports

Also, I have "style-loader", "css-loader", "sass-loader" installed