Registry / babel-plugin-jsxfileattribute

babel-plugin-jsxfileattribute

library1.1.5jsnpmunverified

A Babel plugin for React that automatically injects file location metadata (data-render-file-name, data-line, data-awakeide) into JSX elements to aid debugging and development. Version 1.1.5 requires @babel/core ^7.0.0-0 as a peer dependency. It allows custom options like userSetPwd for monorepo support, exclusions for Fragment components, and toggles for showing complete file paths. Designed primarily for development environments.

npm install babel-plugin-jsxfileattribute

github ↗package ↗

INSTALL

IMPORT

SIG · BABEL-PLUGIN-JSXFI

babel-plugin-jsxfileattribute

javascriptv1.1.5

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

babelPluginJsxFileAttribute

✓ const babelPluginJsxFileAttribute = require('babel-plugin-jsxfileattribute');

✗ import babelPluginJsxFileAttribute from 'babel-plugin-jsxfileattribute';

This package does not export ESM; use CommonJS require. No default export name is documented.

default (ESM alternative)

✓ import pkg from 'babel-plugin-jsxfileattribute'; const babelPluginJsxFileAttribute = pkg.default || pkg;

✗ import { babelPluginJsxFileAttribute } from 'babel-plugin-jsxfileattribute';

Named import is not supported. Use default import and possibly access .default.

plugin usage in babel.config.js

✓ plugins: [[ require('babel-plugin-jsxfileattribute'), { options } ]]

✗ plugins: ['babel-plugin-jsxfileattribute']

Must call require() to get the function, not pass string. Options object is optional.

This shows how to configure the plugin for development, enabling file attribute injection with options.

// babel.config.js module.exports = { plugins: [ process.env.NODE_ENV === 'development' && [ require('babel-plugin-jsxfileattribute'), { userSetPwd: '/path/to/cut', isShowAwakeIdeMsg: true, onlyShowAwakeIdeMsg: true, showCompleteFilePath: false, exclude: ["Fragment", "React.Fragment"] } ] ].filter(Boolean) };

Debug

Known issues

gotchaPlugin must only be used in development environment to avoid leaking file paths to production.

fix

Wrap plugin addition with process.env.NODE_ENV === 'development' condition.

affects: >=1.0.0

gotchaOptions like showCompleteFilePath and isShowAwakeIdeMsg have default values that may conflict with user overrides.

fix

Explicitly define all options to ensure expected behavior.

affects: >=1.0.0

gotchaExclude list is case-sensitive; default is ["Fragment", "React.Fragment"]. Typing "fragment" will not exclude.

fix

Use exact casing as shown in documentation.

affects: >=1.0.0

breakingOnly CommonJS require works; attempting ESM import results in undefined default export.

fix

Use const plugin = require('babel-plugin-jsxfileattribute'); instead of import.

affects: >=1.0.0

Errors

Common errors & fixes

Module not found: Error: Can't resolve 'babel-plugin-jsxfileattribute'

Package not installed or typo in package name.

fix

Run npm install babel-plugin-jsxfileattribute --save-dev

TypeError: babelPluginJsxFileAttribute is not a function

Using import { babelPluginJsxFileAttribute } ... instead of default import/require.

fix

Change to const babelPluginJsxFileAttribute = require('babel-plugin-jsxfileattribute');

Uncaught Error: @babel/core is required as a peer dependency

@babel/core is missing or version incompatible.

fix

Install @babel/core: npm install @babel/core --save-dev

Upgrade

Version history

1.1.5latest on npm

Audit

Dependencies

@babel/corerequiredpeer dependency required for Babel plugin system

Agent activity

9 hits · last 30 days

node

Resources

githubhttps://github.com/webgzh907247189/babel-plugin ↗

packagehttps://www.npmjs.com/package/babel-plugin-jsxfileattribute ↗