babel-plugin-react-wrapped-display-name
v1.0.0
Published
A Babel 7 plugin which transforms add display name to React functional component
Downloads
84
Readme
babel-plugin-react-wrapped-display-name
Solve problem with unnamed component, which created with arrow function.
Example
In
export const FancyComponentName = memo(
({ name }) => <div>{name}</div>);
Out
export const FancyComponentName = memo(
({ name }) => <div>{name}</div>);
FancyComponentName.displayName = "Memo(FancyComponentName)";
Installation
npm install @babel/core babel-plugin-react-wrapped-display-name
Usage
Via babel.config.js
(Recommended)
module.exports = (api) => ({
plugins: [
'babel-plugin-react-wrapped-display-name',
],
});
Via CLI
babel --plugins babel-plugin-react-wrapped-display-name
Via Node API
require('@babel/core').transform(code, {
plugins: [
'babel-plugin-react-wrapped-display-name',
],
});