Registry / serialization / babel-plugin-fbt

babel-plugin-fbt

library1.0.0jsnpmunverified

The main Babel transform plugin for Facebook's FBT (Facebook Translation) internationalization framework. Current stable version is 1.0.0, released with a regular cadence alongside the FBT ecosystem. It provides compile-time extraction and transformation of <fbt> elements and fbt() calls for localization. Key differentiators include React-integrated string interpolation with gender and number variations, and a hash-based string collection approach. Requires pairing with fbt-babel-plugin-runtime for runtime token resolution and @fbtjs/default-collection-transform for string collection outputs.

serialization web-framework

npm install babel-plugin-fbt

github ↗package ↗

INSTALL

IMPORT

SIG · BABEL-PLUGIN-FBT

babel-plugin-fbt

serializationjavascriptv1.0.0

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.

default export (plugin)

✓ module.exports = require('babel-plugin-fbt');

✗ import plugin from 'babel-plugin-fbt';

This is a Babel plugin, not a JS module for direct import. It's used in .babelrc or babel.config.js as 'babel-plugin-fbt'.

Babel config usage

✓ plugins: ['babel-plugin-fbt']

✗ plugins: [require('babel-plugin-fbt')]

Babel resolves string plugin names automatically. Using require() works but is unnecessary and less portable.

TypeScript type import

✓ import type { FbtPluginOptions } from 'babel-plugin-fbt';

The package does not ship TypeScript types; custom type definitions would need to be created.

Installs the FBT Babel plugin and runtime, configures them, and demonstrates basic usage with a React JSX component.

// Install dependencies npm install --save-dev babel-plugin-fbt @fbtjs/default-collection-transform npm install --save fbt babel-plugin-fbt-runtime // babel.config.js module.exports = { plugins: [ ['babel-plugin-fbt', { fbtEnumPath: 'path/to/enums', fbtCommonPath: 'path/to/common-strings.json', }], 'babel-plugin-fbt-runtime' ] }; // Then in React code: <fbt desc="example">Hello, <fbt:param name="name">{name}</fbt:param>!</fbt>

Debug

Known issues

breakingVersion 1.0.0 changed peer dependency from fbt to @fbtjs/default-collection-transform.

fix

Install @fbtjs/default-collection-transform as a devDependency.

affects: >=1.0.0

deprecatedThe fbtCommonPath and fbtEnumPath options are deprecated in favor of using the collection transform.

fix

Migrate to using @fbtjs/default-collection-transform and remove fbtCommonPath/fbtEnumPath from plugin options.

affects: >=0.16.0

gotchaPlugin order matters: babel-plugin-fbt must come before babel-plugin-fbt-runtime in the plugins array.

fix

Ensure plugins are ordered correctly: first babel-plugin-fbt, then babel-plugin-fbt-runtime.

affects: >=0.12.0

gotchaThe fbt package must be installed as a runtime dependency, not devDependency, for the runtime plugin to work.

fix

Install fbt as a regular dependency: npm install fbt

affects: *

Errors

Common errors & fixes

Error: Cannot find module '@fbtjs/default-collection-transform'

Missing peer dependency after upgrading to v1.0.0.

fix

Run: npm install --save-dev @fbtjs/default-collection-transform

TypeError: Cannot read properties of undefined (reading 'fbt')

Runtime plugin is not installed or configured, or fbt runtime import is missing.

fix

Install babel-plugin-fbt-runtime and add it to babel.config.js after babel-plugin-fbt.

SyntaxError: Unexpected token, expected "..." while parsing JSX with <fbt>

Babel is not configured to parse JSX, or the plugin order is wrong.

fix

Ensure @babel/preset-react is included and that babel-plugin-fbt appears before the runtime plugin in the plugins array.

Upgrade

Version history

1.0.0latest on npm

Audit

Dependencies

@fbtjs/default-collection-transformrequiredRequired for converting collected strings to output format; peer dependency.

babel-plugin-fbt-runtimeoptionalRuntime counterpart needed for token replacement in production builds.

Agent activity

17 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/facebook/fbt ↗

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