Skip to content

WanQuanXie/babel-plugin-lucide-react-native

Repository files navigation

babel-plugin-lucide-react-native

GitHub License Codecov (with branch) NPM Version

English | 中文

🎉 v1.0.0 The plugin released first stable version! This version covered most usage scenes. full usage cases
🐛 Bugs: Please file an issue for bugs, missing documentation, or unexpected behavior.
💡 Feature Requests: Please file an issue to suggest new features.
Star Welcome!If this plugin helped you, please give me a star❤️

📖 Documentation

This plugin is a transform to remove unused lucide icon dependencies in React Native, without forcing the user to cherry pick methods manually. This lets you use lucide-react-native naturally (aka as documented) without worrying about bundling parts you're not using.

Example

Converts

import { BookHeart, Search } from "lucide-react-native";

function App() {
  return (
    <View>
      <BookHeart />
      <Search />
    </View>
  );
}

Roughly to

import BookHeart from "lucide-react-native/dist/esm/icons/book-heart";
import Search from "lucide-react-native/dist/esm/icons/search";

function App() {
  return (
    <View>
      <BookHeart />
      <Search />
    </View>
  );
}

Limitations

  • You must be using ES6 imports (both specifiers and default work) to load lucide-react-native.

FAQ

I receive TypeError: The plugin "lucide-react-native" didn’t export a Plugin instance
or, can I use this plugin with Babel v5?

Ensure your Babel version is 7.0.0 or higher. This plugin is only compatible with Babel 7.

Usage

Via babel.config.js (Recommended)
{
  "plugins": ["lucide-react-native"]
}

or

{
  "plugins": [
    [
      "lucide-react-native",
      {
        "useES": true
      }
    ]
  ]
}

when useES is set to true, it will use lucide-react-native/dist/esm/ instead of lucide-react-native/dist/cjs/. Default: false.


Inspiration

This is inspired by babel-plugin-ramda