How to use asset in Storybook ?

[lone cargo]

Hey guys, i'm using StoryBook with Angular and I'd like to create a component ( a button in my case) and put an icon in it. I don't know how to do display the asset and the example in the doc page which talking about this topic doesn't work for me.. any solution ?

[molten tendon]

The storybook builder in angular.json can have the same "assets": [] option as an Angular app. So, using assets in a story should not be any different than in your app.

[lone cargo]

Thank you very much 🙏

[gritty veldt]

@molten tendon — It looks like our docs, https://storybook.js.org/docs/angular/configure/images-and-assets, could be updated to include that detail, yeah?

[molten tendon]

Yeah. I don't think there is a problem with using Storybook's "staticDirs" config, but I updated the builder to include the "assets" option a while ago to avoid maintaining two formats.

I use the object syntax on some assets, which lets the source and destination paths be specified and I don't know if "staticDirs" allows that.

I didn't realize the builder options list doesn't include it either. I guess I just assumed those options, in the docs, were generated from the json schema. https://storybook.js.org/docs/angular/get-started/install#start-storybook

[gritty veldt]

staticDirs does support an object syntax: https://storybook.js.org/docs/angular/api/main-config-static-dirs#with-configuration-objects

---

The options documented there are hard-coded: https://github.com/storybookjs/storybook/blob/next/docs/get-started/installation-problems/angular.mdx#L27-L43