{"id":19101,"library":"babel-plugin-mjsx","title":"babel-plugin-mjsx","description":"Babel plugin for Mithril JSX precompilation, converting JSX into Mithril virtual DOM nodes (e.g., {tag: 'div', attrs: {}, children: []}). Current stable version is 4.1.1. The plugin has evolved through major versions, with v4.0.0 changing whitespace trimming behavior and v4.1.0 adding jsxCompliant (attribute casing) and warnDeprecatedHtml options. It is the primary JSX compiler for Mithril v2+ and precompilation yields performance benefits over runtime interpretation.","status":"active","version":"4.1.1","language":"javascript","source_language":"en","source_url":"https://github.com/Naddiseo/babel-plugin-mjsx","tags":["javascript","mithril","babel","plugin","babel-plugin"],"install":[{"cmd":"npm install babel-plugin-mjsx","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-mjsx","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-mjsx","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Babel plugin requires Babel core to function","package":"@babel/core","optional":false}],"imports":[{"note":"Babel plugin names are automatic without 'babel-plugin-' prefix","wrong":"plugins: ['babel-plugin-mjsx']","symbol":"plugin","correct":"plugins: ['mjsx']"},{"note":"Option must be boolean, not string","wrong":"plugins: [['mjsx', { jsxCompliant: 'true' }]]","symbol":"jsxCompliant","correct":"plugins: [['mjsx', { jsxCompliant: true }]]"},{"note":"Explicit option name is 'warnDeprecatedHtml'","wrong":"plugins: [['mjsx', { deprecated: true }]]","symbol":"warnDeprecatedHtml","correct":"plugins: [['mjsx', { warnDeprecatedHtml: true }]]"}],"quickstart":{"code":"// .babelrc\n{\n  \"plugins\": [\n    [\"mjsx\", { jsxCompliant: true, warnDeprecatedHtml: false }]\n  ]\n}\n\n// Input:\nconst view = () => (\n  <div className=\"container\">\n    <Component foo=\"bar\">Text</Component>\n  </div>\n);\n\n// Output (simplified):\nconst view = () => ({\n  tag: 'div',\n  attrs: { className: 'container' },\n  children: [\n    m.component(Component, { foo: 'bar' }, ['Text'])\n  ]\n});","lang":"javascript","description":"Demonstrates Babel configuration and JSX-to-Mithril precompilation output."},"warnings":[{"fix":"Update to v4.0.0+ and adjust templates if whitespace matters.","message":"v4.0.0 changed whitespace trimming behavior to match v1.x; existing code may render differently if relying on whitespace.","severity":"breaking","affected_versions":"<4.0.0"},{"fix":"Use 'warnDeprecatedHtml' instead of 'deprecated'.","message":"v4.1.0 changed option name from 'deprecated' to 'warnDeprecatedHtml'. Using deprecated option name will be ignored.","severity":"deprecated","affected_versions":">=4.1.0"},{"fix":"Use 'mjsx' as plugin name in .babelrc or programmatic config.","message":"Plugin name in Babel config must be 'mjsx', not 'babel-plugin-mjsx' or Babel will fail to find it.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Ensure your Mithril version is compatible or manually adjust output.","message":"The plugin outputs Mithril v1-style m.component() for custom components; Mithril v2 uses m() directly. This may cause confusion.","severity":"gotcha","affected_versions":">=4.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use 'mjsx' in Babel config, not 'babel-plugin-mjsx'.","cause":"Plugin name incorrectly prefixed with 'babel-plugin-' in config, but npm installed correctly.","error":"Error: Cannot find module 'babel-plugin-mjsx'"},{"fix":"Replace 'deprecated' with 'warnDeprecatedHtml'.","cause":"Using 'deprecated' option name after v4.1.0.","error":"Unsupported option: deprecated"},{"fix":"Ensure JSX always returns a valid element or wrap conditionals with m() or fragment.","cause":"JSX returning null or undefined, e.g., conditional rendering without fallback.","error":"TypeError: Cannot read properties of null (reading 'tag')"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}