Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/r3dDoX/vite-plugin-svgo
Vite plugin to import and compress svg files with SVGO
https://github.com/r3dDoX/vite-plugin-svgo
Last synced: about 2 months ago
JSON representation
Vite plugin to import and compress svg files with SVGO
- Host: GitHub
- URL: https://github.com/r3dDoX/vite-plugin-svgo
- Owner: r3dDoX
- Created: 2022-10-15T11:56:12.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-11-29T07:24:32.000Z (10 months ago)
- Last Synced: 2024-07-19T07:12:12.810Z (about 2 months ago)
- Language: TypeScript
- Size: 75.2 KB
- Stars: 27
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- fucking-awesome-vite - vite-plugin-svgo - Load SVGs as plain string and transform with SVGO library. (Plugins / Framework-agnostic Plugins)
- awesome-vite - vite-plugin-svgo - Load SVGs as plain string and transform with SVGO library. (Plugins / Framework-agnostic Plugins)
README
# Vite Plugin SVGO
> Vite plugin to load and optimize SVG files as raw string. For the optimization SVGO is used.
![npm](https://img.shields.io/npm/dt/vite-plugin-svgo?style=flat-square)
![GitHub package.json version](https://img.shields.io/github/package-json/v/r3dDoX/vite-plugin-svgo?color=brightgreen&style=flat-square)```typescript
// Lit-Element example
import {html, unsafeSVG} from 'lit';
import icon from '../assets/icon.svg';html`
${unsafeSVG(icon)}
`;
```## Install
```
npm install -D vite-plugin-svgo
```## Setup
```typescript
import svg from 'vite-plugin-svgo'export default defineConfig({
plugins: [svg()]
})
```## SVGO Configuration
The plugin accepts custom optimize options.
```typescript
// vite.config.ts
svg({
multipass: true,
plugins: [
{
name: 'preset-default',
params: {
overrides: {
convertColors: {
currentColor: true,
},
},
},
},
],
})
```