storybook/docs/snippets/web-components/component-story-static-asset-with-import.js.mdx
2023-02-16 09:13:06 +08:00

27 lines
556 B
Plaintext

```js
// MyComponent.stories.js
import { html } from 'lit';
import imageFile from './static/image.png';
export default {
title: 'img',
component: 'my-component',
};
const image = {
src: imageFile,
alt: 'my image',
};
/*
*👇 Render functions are a framework specific feature to allow you control on how the component renders.
* See https://storybook.js.org/docs/7.0/web-components/api/csf
* to learn how to use render functions.
*/
export const WithAnImage = {
render: () => html`<img src="${image.src}" alt="${image.alt}" /> `,
};
```