babel-plugin-jsx-wrap-if

0.1.1 verified Sat Apr 25 auth: no javascript abandoned

Babel plugin for React that conditionally wraps JSX elements based on a prop. Version 0.1.1, no active maintenance. When the `wrap-if` prop is truthy, the element wraps its children; when falsy, the children are rendered without the wrapper. Simple alternative to inline ternaries or helper components. No updates since 2019, likely abandoned. Only 1 GitHub star. Use for legacy projects or simple conditional wrapping without extra components.

Common errors

error Error: Cannot find module 'babel-plugin-jsx-wrap-if' ↓

cause Missing npm install or typo in plugin name.

fix

Run 'npm install babel-plugin-jsx-wrap-if --save-dev' and verify plugin string is 'jsx-wrap-if'.

Warnings

deprecated Package is unmaintained since 2019. ↓

fix Consider using inline ternary or a conditional wrapper component instead.

Install

npm install babel-plugin-jsx-wrap-if

yarn add babel-plugin-jsx-wrap-if

pnpm add babel-plugin-jsx-wrap-if

Imports

default
wrong
```
import plugin from 'babel-plugin-jsx-wrap-if'
```
correct
```
module.exports = { plugins: ['jsx-wrap-if'] }
```
Used as a Babel plugin string in config, not imported directly in source code.

Quickstart

Shows how to configure the Babel plugin and use the wrap-if prop in JSX for conditional rendering.

// babel.config.js
module.exports = {
  plugins: ['jsx-wrap-if']
};

// React component
function ConditionalBlock({ condition, children }) {
  return (
    <blockquote wrap-if={condition}>
      {children}
    </blockquote>
  );
}