esbuild-plugin-svgr

esbuild-plugin-svgr

A plugin for esbuild that adds support for *.svg file imports as React components. The plugin is built on top of SVGR.

Basic Usage

1. Install the plugin in your project:

npm install --save-dev esbuild-plugin-svgr
# or use yarn
yarn add --dev esbuild-plugin-svgr

1. Add this plugin to your esbuild build script:

const svgrPlugin = require('esbuild-plugin-svgr');

esbuild.build({
    plugins: [
        svgrPlugin(),
    ],
});

1. Import your *.svg file from JavaScript:

import Icon from './icon.svg';

function App() {
    return (
        <div>
            <Icon />
        </div>
    );
}

1. Pass in optional supported configuration options:

esbuild.build({
    plugins: [
        svgrPlugin({ ref: true }),
    ],
});

Author

Kazi Jawad

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Acknowledgements

SVGR