{"id":19273,"library":"babel-preset-enact","title":"babel-preset-enact","description":"Babel preset used by the Enact framework for building React-based applications. Current stable version is 0.1.16, with maintenance releases updating dependencies. It provides a pre-configured set of Babel plugins and presets optimized for Enact projects. Key differentiators include tailored support for Enact's component model and seamless integration with Enact CLI, which includes it by default. For non-Enact projects, it can be installed separately to leverage similar transforms. Releases are infrequent, focusing on dependency updates rather than feature additions.","status":"active","version":"0.1.16","language":"javascript","source_language":"en","source_url":"https://github.com/enactjs/babel-preset-enact","tags":["javascript"],"install":[{"cmd":"npm install babel-preset-enact","lang":"bash","label":"npm"},{"cmd":"yarn add babel-preset-enact","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-preset-enact","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for Babel preset to function","package":"@babel/core","optional":false},{"reason":"Core preset for environment-specific transpilation","package":"@babel/preset-env","optional":false},{"reason":"Required for JSX and React-specific transforms","package":"@babel/preset-react","optional":false},{"reason":"Used for transforming class properties","package":"@babel/plugin-proposal-class-properties","optional":false},{"reason":"Used for transforming object rest/spread properties","package":"@babel/plugin-proposal-object-rest-spread","optional":false},{"reason":"Helps avoid duplication of helpers and polyfills","package":"@babel/plugin-transform-runtime","optional":true}],"imports":[{"note":"ESM import is not supported; use CommonJS require or configure in .babelrc as a string preset name.","wrong":"import Preset from 'babel-preset-enact'","symbol":"Preset","correct":"module.exports = require('babel-preset-enact')"},{"note":"In .babelrc, use the full package name 'babel-preset-enact', not the short 'enact'.","wrong":"{\n  \"presets\": [\"enact\"]\n}","symbol":"Configuration","correct":"{\n  \"presets\": [\"babel-preset-enact\"]\n}"},{"note":"When combining presets, ensure correct ordering and avoid redundant preset-env inclusion.","wrong":"{\n  \"presets\": [\"babel-preset-enact\", \"@babel/preset-env\"]\n}","symbol":"env","correct":"{\n  \"presets\": [\"babel-preset-enact\", \"module:preset-env\"]\n}"}],"quickstart":{"code":"// Install dependencies\nnpm install --save-dev babel-preset-enact @babel/core\n\n// Create .babelrc in project root\n{\n  \"presets\": [\"babel-preset-enact\"]\n}\n\n// Sample React component using Enact\nimport kind from '@enact/core/kind';\nimport Button from '@enact/agate/Button';\n\nconst MyApp = kind({\n  name: 'MyApp',\n  render: () => (\n    <div>\n      <Button>Click me</Button>\n    </div>\n  )\n});\n\nexport default MyApp;\n\n// Build with Babel\nnpx babel src --out-dir lib","lang":"javascript","description":"Shows how to install and configure babel-preset-enact in a non-Enact CLI project, including a basic React component."},"warnings":[{"fix":"Update to version 0.1.10 or later to remove deprecated plugins like @babel/plugin-transform-react-inline-elements.","message":"Deprecated Babel plugins included","severity":"deprecated","affected_versions":">=0.1.0 <0.1.10"},{"fix":"Ensure your project depends on @enact/core and other Enact packages, or use a more generic preset like @babel/preset-react.","message":"This preset is designed specifically for Enact projects. Using it with non-Enact React apps may result in unexpected behavior or missing configuration.","severity":"gotcha","affected_versions":"all"},{"fix":"Upgrade React to a version compatible with the removal, or if using React 19, consider adding the plugin back manually.","message":"Removal of @babel/plugin-transform-react-inline-elements in 0.1.10 causes production build errors with React 19","severity":"breaking","affected_versions":">=0.1.10"},{"fix":"Update your ESLint config to use @stylistic/js rules if you rely on the replaced rules.","message":"Replaced deprecated ESLint rules with @stylistic/js rules in version 0.1.8","severity":"breaking","affected_versions":">=0.1.8"},{"fix":"For Enact CLI projects, do not install this preset separately; the CLI includes it automatically.","message":"The package babel-preset-enact may be superseded by built-in Babel configuration in Enact CLI","severity":"deprecated","affected_versions":"all"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use full package name: \"babel-preset-enact\" instead of just \"enact\".","cause":"Using incorrect preset name in .babelrc","error":"Error: Cannot find module '@babel/preset-enact'"},{"fix":"In .babelrc, ensure presets array contains strings, not objects. Example: { \"presets\": [\"babel-preset-enact\"] }","cause":"Invalid configuration format or missing require statement","error":"Module build failed (from ./node_modules/babel-loader/lib/index.js):\nError: [BABEL] ...: Preset .enact requires a module of type 'object' but got 'string'"},{"fix":"Ensure .babelrc includes 'babel-preset-enact' and that @babel/core is installed.","cause":"Babel is not transpiling ES modules, possibly due to missing preset or incorrect configuration","error":"SyntaxError: Unexpected token (1:1)\n> 1 | import kind from '@enact/core/kind';\n    | ^"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}