UNPKG

@kode-frontend/svg-transformer

Version:

CLI to optimize and convert SVGs to React/React Native components

96 lines (63 loc) 2.39 kB
# @kode-frontend/svg-transformer 🚀 Easily convert SVGs into optimized React or React Native components with this CLI. ## 🌟 Why Use This? With `@kode-frontend/svg-transformer`, you can: - **Automatically optimize** icons for enhanced performance. - **Create components effortlessly** for React or React Native. ## 🛠 Usage Whether you want a quick one-off run or plan to integrate it into your project, `@kode-frontend/svg-transformer` has you covered. ### 📋 Without Installation Run the CLI directly without installing it globally: ```bash # Using npx npx @kode-frontend/svg-transformer -i ./icons -o ./output -p react # Using pnpm exec pnpm exec @kode-frontend/svg-transformer -i ./icons -o ./output -p react # Using yarn dlx yarn dlx @kode-frontend/svg-transformer -i ./icons -o ./output -p react ``` ### 🌍 Global Installation Install globally to use the CLI anywhere: ```bash # npm npm install -g @kode-frontend/svg-transformer # pnpm pnpm add -g @kode-frontend/svg-transformer # yarn yarn global add @kode-frontend/svg-transformer ``` Run it globally: ```bash @kode-frontend/svg-transformer -i ./icons -o ./output -p react ``` ### 📦 Local Installation Install as a development dependency in your project: ```bash # npm npm install --save-dev @kode-frontend/svg-transformer # yarn yarn add --dev @kode-frontend/svg-transformer # pnpm pnpm add -D @kode-frontend/svg-transformer ``` Run the CLI via npm scripts or a direct command: ```bash # npm script npm run @kode-frontend/svg-transformer -- -i ./icons -o ./output -p react # yarn yarn @kode-frontend/svg-transformer -i ./icons -o ./output -p react # pnpm pnpm @kode-frontend/svg-transformer -i ./icons -o ./output -p react ``` ### ⚙️ Options | Option | Description | Default | | ------------- | ----------------------------------------------------- | -------- | | --input | Input folder containing SVG files | ./icons | | --output | **Output folder** to save React components | ./output | | --platform | Target platform: **react** or **react-native** | react | | --interactive | Run in interactive mode to configure options manually | false | ### 🖐 Interactive Mode Use interactive mode for guided configuration: ```bash npx @kode-frontend/svg-transformer --interactive ```