# rollup-plugin-svgr

> simple rollup plugin svgr without svgo or babel

Latest version **4.0.1** (published 2024-12-06) · ISC license · 0 weekly downloads

## Install

```sh
npm install rollup-plugin-svgr
pnpm add rollup-plugin-svgr
yarn add rollup-plugin-svgr
bun add rollup-plugin-svgr
```

## Health

**Score 40/100 (D)** — status: stable.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 4.0.1 |
| Published | 2024-12-06 |
| First published | 2022-03-22 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=20.9.0 |
| Dependencies | 3 |
| Unpacked size | 8.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Christophe Hurpeau <christophe@hurpeau.com> (https://christophe.hurpeau.com) |
| Maintainers | churpeau |

## Links

- npm: https://www.npmjs.com/package/rollup-plugin-svgr
- Repository: https://github.com/christophehurpeau/rollup-plugin-svgr.git
- Homepage: https://github.com/christophehurpeau/rollup-plugin-svgr
- npm.io page: https://npm.io/package/rollup-plugin-svgr

## Dependencies (3)

- [@svgr/core](https://npm.io/package/@svgr/core.md) ^8.1.0
- [@svgr/plugin-jsx](https://npm.io/package/@svgr/plugin-jsx.md) ^8.1.0
- [@rollup/pluginutils](https://npm.io/package/@rollup/pluginutils.md) ^5.1.3

## Recent versions

- 4.0.1 (latest) — 2024-12-06
- 4.0.0 — 2024-12-06
- 3.0.0 — 2024-12-06
- 2.1.0 — 2024-08-17
- 2.0.0 — 2023-06-27
- 1.0.0 — 2022-03-22

## README

<h3 align="center">
  rollup-plugin-svgr
</h3>

<p align="center">
  simple rollup plugin svgr without svgo or babel
</p>

<p align="center">
  <a href="https://npmjs.org/package/rollup-plugin-svgr"><img src="https://img.shields.io/npm/v/rollup-plugin-svgr.svg?style=flat-square"></a>
  <a href="https://npmjs.org/package/rollup-plugin-svgr"><img src="https://img.shields.io/npm/dw/rollup-plugin-svgr.svg?style=flat-square"></a>
  <a href="https://npmjs.org/package/rollup-plugin-svgr"><img src="https://img.shields.io/node/v/rollup-plugin-svgr.svg?style=flat-square"></a>
  <a href="https://npmjs.org/package/rollup-plugin-svgr"><img src="https://img.shields.io/npm/types/rollup-plugin-svgr.svg?style=flat-square"></a>
</p>

## Install

```bash
npm install --save-dev rollup-plugin-svgr
```

## Alternatives

Official https://www.npmjs.com/package/@svgr/rollup which has svgo and babel enabled by default, unlike this library.

## Usage

```js
{
  plugins: [svgr()];
}
```

```js
{
  plugins: [svgr({ native: true })];
}
```

You can add a additional transform step. For example, babel: first, you need `@babel/core`, `@babel/preset-react` and `@babel/preset-env` installed, then pass `transform` option:

```js
import { loadPartialConfig, transformAsync } from "@babel/core";
const babelConfig = loadPartialConfig({
  babelrc: false,
  configFile: false,
  presets: ["@babel/preset-env", "@babel/preset-react"],
});

{
  plugins: [
    svgr({
      transform: async (code) => {
        const result = await transformAsync(code, babelConfig.options);
        if (!result?.code) {
          throw new Error("Error while transforming using Babel");
        }
        return result.code;
      },
    }),
  ];
}
```

## No svgo enabled

Svgo at runtime is costly, consider using a tool like [lint-staged-imagemin](https://www.npmjs.com/package/lint-staged-imagemin) instead, or simply run and commit svgo modified files.

---
_Source: https://npm.io/package/rollup-plugin-svgr · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._