4.2.0•Public•Published
Vite plugin to transform SVGs into React components. Uses svgr under the hood. Then SVG files can be imported as React components: If you are using TypeScript, there is also a declaration helper for better type inference: If you want to enable SVGO you can install MITInstallation
# npmnpm install --save-dev vite-plugin-svgr# yarnyarn add -D vite-plugin-svgr# pnpmpnpm add -D vite-plugin-svgr
Usage
// vite.config.jsimport svgr from "vite-plugin-svgr";export default { // ... plugins: [svgr()],};
import Logo from "./logo.svg?react";
/// <reference types="vite-plugin-svgr/client" />
Options
svgr({ // svgr options: https://react-svgr.com/docs/options/ svgrOptions: { // ... }, // esbuild options, to transform jsx to js esbuildOptions: { // ... }, // A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should include. include: "**/*.svg?react", // A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored. exclude: "",});
@svgr/plugin-svgo
and use following options to enable and configure it:svgr({ svgrOptions: { plugins: ["@svgr/plugin-svgo", "@svgr/plugin-jsx"], svgoConfig: { floatPrecision: 2, }, }, // ...});
License
Package Sidebar
Install
npm i vite-plugin-svgr
Repository
Weekly Downloads
1,288,874
Version
4.2.0
License
MIT
Unpacked Size
9.56 kB
Total Files
8