1.1.0 • Published 1 year ago
babel-plugin-transform-react-remove-display-name v1.1.0
babel-plugin-transform-react-remove-display-name
Make React component displayName
property available only in none production environment during the build :sparkles:
Installation
$ npm install --save-dev babel-plugin-transform-react-remove-display-name
// or
$ yarn add --dev babel-plugin-transform-react-remove-display-name
This plugin is for Babel 7
Story
This plugin was originally created for Semantic UI React package.
It wraps each React component displayName
property with an if statement which makes sure it will be available only in none production environment.
Example transform
In
const Baz = (props) => (
<div {...props} />
)
Baz.displayName = "Baz"
Out
const Baz = (props) => (
<div {...props} />
)
if(process.env.NODE_ENV !== 'production') {
Baz.displayName = "Baz"
}
Usage
Via .babelrc
(Recommended)
.babelrc
{
"plugins": ["transform-react-remove-display-name"]
}
Via CLI
$ babel --plugins transform-react-remove-display-name script.js
Via Node API
require("babel-core").transform("code", {
plugins: ["transform-react-remove-display-name"]
});
Inspiration
This plugin is inspired by:
License
MIT