---
title: "@farmfe/plugin-image"
locale: "en"
version: "current"
canonicalUrl: "https://farmfe.org/docs/plugins/official-plugins/image"
publicationStatus: "prerelease"
---

<a id="farmfeplugin-image"></a>
# @farmfe/plugin-image


A Rust Farm plugin that imports JPG, PNG, GIF, SVG, and WebP files as base64 data URIs.


<a id="requirements"></a>
## Requirements


This plugin requires Node.js v18.0.0+ and Farm v1.0.0+.


<a id="installation"></a>
## Installation


**npm**

```javascript
npm install @farmfe/plugin-image
```


**yarn**

```javascript
yarn add @farmfe/plugin-image
```


**pnpm**

```javascript
pnpm add @farmfe/plugin-image
```



<a id="usage"></a>
## Usage


Register the plugin in ` farm.config.ts `:


```ts
import { defineConfig } from "@farmfe/core";
import image from "@farmfe/plugin-image";

export default defineConfig({
  plugins: [image()],
});
```


Then import images from application code:


```js
import logo from "./logo.png";

console.log(logo);
```


<a id="options"></a>
## Options


- ` dom?: boolean ` — when ` true `, export a DOM ` Image ` element instead of a base64 string. Defaults to ` false `.
- ` include?: string[] ` — regex patterns for files the plugin should process.
- ` exclude?: string[] ` — regex patterns for files the plugin should ignore.


With ` dom: true `, the imported value can be appended directly to the document:


```js
import logo from "./logo.png";

document.body.appendChild(logo);
```