Registry / web-framework / vite-plugin-transform-lucide-imports

vite-plugin-transform-lucide-imports

library0.3.1jsnpmunverified

A Vite plugin (v0.3.1) that transforms named imports from lucide icon packages into default imports for improved dev server performance and tree-shaking. It is actively maintained with patches for Vite 8 compatibility and handles aliased icons, type imports, and multiple frameworks (React, Svelte, vanilla JS). Unlike alternatives that require manual refactoring, this plugin automates the conversion with zero config. Supports custom file extensions for other frameworks.

web-framework devops

npm install vite-plugin-transform-lucide-imports

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-TRANSF

vite-plugin-transform-lucide-imports

web-frameworkjavascriptv0.3.1

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

transformLucideImports

✓ import transformLucideImports from 'vite-plugin-transform-lucide-imports'

✗ import { transformLucideImports } from 'vite-plugin-transform-lucide-imports'

Default export only; named destructure will cause undefined.

SUPPORTED_EXTENSIONS

✓ import { SUPPORTED_EXTENSIONS } from 'vite-plugin-transform-lucide-imports'

✗ import SUPPORTED_EXTENSIONS from 'vite-plugin-transform-lucide-imports'

Named export, not default.

VitePluginTransformLucideImports

✓ import type { VitePluginTransformLucideImports } from 'vite-plugin-transform-lucide-imports'

✗ import { VitePluginTransformLucideImports } from 'vite-plugin-transform-lucide-imports'

TypeScript type only; do not use as value.

Shows minimal Vite config with the plugin, and the transformation effect on import statements.

// Install: npm i -D vite-plugin-transform-lucide-imports import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; import transformLucideImports from 'vite-plugin-transform-lucide-imports'; export default defineConfig({ plugins: [react(), transformLucideImports()], }); // Before: import { HomeIcon } from 'lucide-react'; // After: import HomeIcon from 'lucide-react/icons/home';

Debug

Known issues

gotchaPlugin must be placed AFTER framework plugins (e.g., SvelteKit) in the plugins array to work correctly.

fix

Ensure transformLucideImports() is listed after plugins that transpile files like .svelte or .vue.

affects: >=0.1.0

gotchaThe plugin does not optimize lucide packages that already support tree-shaking (lucide, lucide-react, lucide-vue, etc.). It only targets packages like lucide-react-native.

fix

Use this plugin only for lucide packages that lack built-in tree-shaking (e.g., lucide-react-native).

affects: >=0.1.0

breakingIn version 0.2.0, the plugin now skips tree-shaken packages to avoid optimization. This may affect projects relying on explicit optimization.

fix

No action needed; the plugin automatically handles it.

affects: >=0.2.0

deprecatedThe 'onwarn' option added in 0.3.0 is experimental and may change in future versions.

fix

Use with caution and review changelog before updating.

affects: >=0.3.0

gotchaType-only imports (e.g., import type { XIcon } from ...) are preserved but moved to separate import statements; ensure your config supports type imports.

fix

Enable 'verbatimModuleSyntax' in tsconfig.json to keep type imports explicit.

affects: >=0.1.0

Errors

Common errors & fixes

Error: 'default' is not exported by node_modules/vite-plugin-transform-lucide-imports/dist/index.mjs, imported by vite.config.ts

Using named import { transformLucideImports } instead of default import.

fix

Change to: import transformLucideImports from 'vite-plugin-transform-lucide-imports';

TypeError: Cannot read properties of undefined (reading 'onwarn')

Plugin version <0.3.0 does not support the 'onwarn' option.

fix

Update to >=0.3.0 or remove the 'onwarn' option from plugin config.

Transform failed with error: Cannot read properties of undefined (reading 'includes')

Plugin ran before framework plugin transformed the file (e.g., .svelte).

fix

Place transformLucideImports() after the Svelte/Vue plugin in the plugins array.

WARN: No matching lucide package found for import from 'lucide-react'

The lucide-react package already supports tree-shaking and is skipped by default.

fix

This warning is informational; no action needed. The import remains unchanged.

Upgrade

Version history

0.3.1latest on npm

Audit

Dependencies

viterequiredPeer dependency for plugin ecosystem

Agent activity

10 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/ieedan/vite-plugin-transform-lucide-imports ↗

packagehttps://www.npmjs.com/package/vite-plugin-transform-lucide-imports ↗