Skip to content

Commit 300a908

Browse files
committed
add img example
1 parent 11382ef commit 300a908

File tree

1 file changed

+17
-0
lines changed

1 file changed

+17
-0
lines changed

docs/components/image.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,23 @@ referenced, so avoid using these. See [Can I
2828
Email](https://www.caniemail.com/features/image-svg/) for more information.
2929
:::
3030

31+
::: tip
32+
To use local images during development, you can resolve the path with node.
33+
Just remember, for production, you'll need to host the images somewhere and
34+
reference them with a URL.
35+
36+
```jsx
37+
import { Img } from 'jsx-email';
38+
39+
const baseUrl = import.meta.DEV ? import.meta.resolve('../assets/') : 'https://assets.example.com/';
40+
41+
const Email = () => {
42+
return <Img src={`${baseUrl}cat.jpg`} alt="Cat" width="300" height="300" />;
43+
};
44+
```
45+
46+
:::
47+
3148
## Component Props
3249

3350
```ts

0 commit comments

Comments
 (0)