This Babel plugin, currently at stable version 0.3.1, is designed to remove specified React component properties during the JavaScript transpilation process. Its primary use case is for optimizing production builds by stripping out attributes like `data-test` or `data-qa`, which are often used for testing and debugging but are unnecessary in deployed code. This minification helps reduce the final bundle size and prevents exposing internal testing hooks to end-users. The package has seen a slow release cadence, with recent updates focused on maintenance and minor feature enhancements. It differentiates itself through its focused application on React properties, providing a cleaner, more efficient production DOM compared to manually removing these attributes or leaving them in. It's configured via Babel's standard `.babelrc` or `babel.config.js` files, allowing for granular control over which properties (including those matching regular expressions) are removed, typically activated only in production environments.
npm install babel-plugin-react-remove-propertiesVerified import paths — ran on the pinned version, not inferred.
This `.babelrc` configuration demonstrates how to remove specific React properties (like `data-test`, `data-qa`, and any property starting with `_qa` followed by digits) exclusively in production builds.
Ensure your project's Babel installation is version 6 or newer. Upgrade Babel if currently using an older version.
Update your Babel configuration to use `properties: ['your-prop-name']` instead of `property: 'your-prop-name'`.
Wrap the plugin configuration within an `env.production` block in your `.babelrc` or use environment-specific Babel configuration files.
Use the short name `"react-remove-properties"` instead of the full package name `"babel-plugin-react-remove-properties"`.
Verify that regular expressions are syntactically correct and match your intended patterns. In `.babelrc`, they can often be provided as string literals that Babel's parser interprets as regex, or directly as `/pattern/` syntax as shown in examples.
Change the plugin name in your Babel configuration (e.g., `.babelrc` or `babel.config.js`) from `"babel-plugin-react-remove-properties"` to `"react-remove-properties"`.
Update your Babel configuration to use the `properties` option, providing an array of strings or regular expressions (e.g., `["react-remove-properties", {"properties": ["data-test"]}]`).Ensure the `properties` option is an array containing strings (e.g., `'data-test'`) or regular expression objects (e.g., `/^qa-/`) for the properties you wish to remove.
No dependency data recorded yet.