Search code examples
javascriptangularsassangular-materialstorybook

How do we configure the loading of global Angular Material theme stylesheets for Storybook?

How do we configure Angular Themes for Storybook such that the Storybook rendered components can load all the classes provided by the Angular theme?

There's a Styling and CSS "Hint" in the storybook documentation, but no example at how to go about loading the compiled global Angular SASS style sheets.

Solution

  • Turns out it's really simple. To import styles.scss just add this to ./storybook/preview.js:

    import '!style-loader!css-loader!sass-loader!../src/styles.scss';