{"id":19094,"library":"babel-plugin-jsx","title":"babel-plugin-jsx","description":"A Babel plugin that transforms JSX into a generic intermediate representation (JSX-IR) rather than React.createElement calls. Version 1.2.0 is the current stable release with no active development since 2017. The plugin outputs plain objects with tag, props, and children fields, making it renderer-agnostic. Key differentiators: it does not require React, supports scope capture for variable resolution, and can be combined with custom renderers from the jsx-ir ecosystem.","status":"maintenance","version":"1.2.0","language":"javascript","source_language":"en","source_url":"https://github.com/jsx-ir/babel-plugin-jsx","tags":["javascript","babel","babel-plugin","plugin","jsx","jsx-ir","babel-jsx","jsx-plugin"],"install":[{"cmd":"npm install babel-plugin-jsx","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-jsx","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-jsx","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The plugin is a function that must be used as a string reference in babel configuration, not required directly.","wrong":"var plugin = require('babel-plugin-jsx'); babel.transform(code, { plugins: [plugin] })","symbol":"default plugin","correct":"babel.transform(code, { plugins: ['babel-plugin-jsx'] })"},{"note":"The generator is required from 'babel-plugin-jsx/gen', not a property of the main module.","wrong":"var plugin = require('babel-plugin-jsx').gen({ captureScope: true })","symbol":"plugin generator","correct":"var jsxGen = require('babel-plugin-jsx/gen'); var plugin = jsxGen({ captureScope: true })"},{"note":"Named import from main module does not work; use default import from subpath.","wrong":"import { gen } from 'babel-plugin-jsx'","symbol":"babel-plugin-jsx/gen","correct":"import jsxGen from 'babel-plugin-jsx/gen'"}],"quickstart":{"code":"const babel = require('babel-core');\nconst jsxGen = require('babel-plugin-jsx/gen');\nconst code = '<div className=\"box\"><List><ListItem index={1} /></List></div>';\nconst result = babel.transform(code, {\n  plugins: [jsxGen({ captureScope: false })],\n  blacklist: ['react']\n});\nconsole.log(result.code);\n// Output: JSX-IR object","lang":"javascript","description":"Transforms JSX code into JSX-IR object using the plugin generator with captureScope disabled."},"warnings":[{"fix":"Use 'exclude' option or upgrade to Babel 7+ and use 'overrides'","message":"Babel 6+ blacklist option is deprecated; use 'only' or 'exclude' instead.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Upgrade to a Babel 7 compatible plugin or use Babel 6.","message":"The 'blacklist' option is no longer supported in Babel 7. Plugin may not work with Babel 7.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Set throwOnMissing: false to defer to runtime error or ensure all JSX tags are in scope.","message":"Scope capture requires variables to be in scope or defined as builtins; missing variables cause compilation error by default.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use Babel 6 or find a Babel 7 compatible alternative.","message":"Plugin is designed for Babel 6; using with Babel 7 may cause unexpected errors due to API changes.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use 'plugins: [\"babel-plugin-jsx\"]' or require the generator submodule: 'plugins: [require(\"babel-plugin-jsx/gen\")()]'","cause":"Trying to require the plugin directly and pass as object instead of using string reference.","error":"ReferenceError: [BABEL] unknown: Plugin . was not found"},{"fix":"Define the variable in scope, add it to builtins array, or set throwOnMissing: false","cause":"Using captureScope: true without having the variable SomeComponent defined in scope or listed in builtins.","error":"Error: Couldn't find scope for tag: SomeComponent"},{"fix":"Use Babel 6 or replace the plugin with a Babel 7 compatible JSX-IR plugin.","cause":"Using babel-plugin-jsx with Babel 7 where the plugin API changed.","error":"TypeError: Cannot read property 'name' of undefined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}