{"id":19211,"library":"babel-plugin-transform-react-es6-displayname","title":"babel-plugin-transform-react-es6-displayname","description":"A Babel plugin that automatically adds a displayName property to React ES6 class components using the class name. This helps with debugging and DevTools when using ES6 classes. Version 1.0.0-beta1.4 is a pre-release with no recent updates; the repository is archived and unmaintained. It only supports ES6 class components (not functional components) and relies on Babel 6.x. No security issues reported.","status":"deprecated","version":"1.0.0-beta1.4","language":"javascript","source_language":"en","source_url":"https://github.com/nathanmarks/babel-plugin-transform-react-es6-displayname","tags":["javascript","babel","transform","es6","classes","react","displayName"],"install":[{"cmd":"npm install babel-plugin-transform-react-es6-displayname","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-transform-react-es6-displayname","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-transform-react-es6-displayname","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required as a Babel plugin; transforms code during build.","package":"babel-core","optional":false}],"imports":[{"note":"This is a Babel plugin, typically loaded via .babelrc or babel.config.js using the string name, not directly imported in application code.","wrong":"import plugin from 'babel-plugin-transform-react-es6-displayname'; // CommonJS, not ESM","symbol":"default","correct":"module.exports = require('babel-plugin-transform-react-es6-displayname');\n// in .babelrc: \"plugins\": [\"transform-react-es6-displayname\"]"}],"quickstart":{"code":"// .babelrc\n{\n  \"plugins\": [\"transform-react-es6-displayname\"]\n}\n\n// Input:\nclass MyComponent extends React.Component {\n  render() { return <div>Hello</div>; }\n}\n\n// Output:\nclass MyComponent extends React.Component {\n  static displayName = 'MyComponent';\n  render() { return <div>Hello</div>; }\n}","lang":"javascript","description":"Shows how to add the plugin to .babelrc and the transformation of a class component."},"warnings":[{"fix":"Consider using babel-plugin-react-displayname which supports functional components and newer Babel versions.","message":"Repository is archived and unmaintained.","severity":"deprecated","affected_versions":">=0.0.0"},{"fix":"Use a different plugin or manually add displayName for functional components.","message":"Only works with ES6 class components; does not add displayName to functional components.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"npm install --save-dev babel-plugin-transform-react-es6-displayname","cause":"Plugin not installed or incorrectly required.","error":"Error: Cannot find module 'babel-plugin-transform-react-es6-displayname'"},{"fix":"Use Babel 6 or switch to a compatible plugin.","cause":"Incompatible with Babel 7+; this plugin is for Babel 6.","error":"Error: The plugin \"transform-react-es6-displayname\" didn't export a Plugin instance"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}