react-native-hardwired-transpiler

0.10.1 verified Fri May 01 auth: no javascript

A transpiler module for the react-native-hardwired ecosystem that transforms ES6+ JavaScript code into a format compatible with Hardwired's dynamic module loading in React Native. This package is part of the Hardwired library enabling runtime code transformation and execution. Version 0.10.1 is the current stable release. It is designed specifically for React Native environments and relies on Babel for transpilation. Differentiates from other transpilers by tight integration with Hardwired's dynamic loading system.

Common errors

error TypeError: (0 , _transpiler.transpile) is not a function ↓

cause Using CommonJS require() on an ES module default export.

fix

Use import { transpile } from 'react-native-hardwired-transpiler'.

error Error: Cannot find module '@babel/core' ↓

cause Missing peer dependency @babel/core.

fix

Run 'npm install @babel/core'.

error TypeError: Cannot read property 'code' of undefined ↓

cause Calling transpile() without awaiting the promise (result is undefined).

fix

Use await transpile(code, options) or .then(result => { ... }).

error SyntaxError: Unexpected token (1:0) in file 'dynamic.js' ↓

cause Transpiled code contains syntax that is not supported by Hermes or React Native's JavaScript engine.

fix

Add a Babel preset like '@babel/preset-env' with modules: false and appropriate targets.

Warnings

breaking The transpile() function now returns a Promise instead of a synchronous result. Code using .code directly will break. ↓

fix Use async/await or .then() to access the result.

deprecated The 'options' parameter no longer accepts 'sourceMaps' as a boolean; use 'sourceMaps: false' or omit. ↓

fix Remove sourceMaps or set to an explicit object.

gotcha The transpiler requires @babel/core to be installed as a peer dependency. Missing it causes cryptic 'Cannot find module' errors. ↓

fix Run 'npm install @babel/core'.

gotcha Using transpile() in React Native's Hermes engine may fail due to missing global objects. Transpiled code should avoid certain ES6 features. ↓

fix Add 'useBuiltIns: false' to options or avoid importing large polyfills.

deprecated The default export HardwiredTranspiler class is deprecated in favor of the named transpile function. ↓

fix Switch to import { transpile } from 'react-native-hardwired-transpiler'.

Install

npm install react-native-hardwired-transpiler

yarn add react-native-hardwired-transpiler

pnpm add react-native-hardwired-transpiler

Imports

transpile

wrong

const transpile = require('react-native-hardwired-transpiler').transpile

correct

import { transpile } from 'react-native-hardwired-transpiler'

ESM-only; CommonJS require may lead to 'exports is not defined' errors.

HardwiredTranspiler

wrong

import { HardwiredTranspiler } from 'react-native-hardwired-transpiler'

correct

import HardwiredTranspiler from 'react-native-hardwired-transpiler'

Default export is a class; named import will be undefined.

TranspilerOptions

wrong

import { TranspilerOptions } from 'react-native-hardwired-transpiler'

correct

import type { TranspilerOptions } from 'react-native-hardwired-transpiler'

TypeScript only; importing as value will fail at runtime.

Quickstart

Shows how to transpile ES6 code and register it with Hardwired's dynamic module loader.

import { transpile } from 'react-native-hardwired-transpiler';
import { HardwiredRegistry } from 'react-native-hardwired';

const code = `export default () => { return 'Hello from Hardwired!'; }`;
const options = { filename: 'dynamic.js', presets: ['@babel/preset-env'] };

transpile(code, options).then(result => {
  HardwiredRegistry.register('dynamic', result.code);
  const module = HardwiredRegistry.load('dynamic');
  console.log(module.default()); // 'Hello from Hardwired!'
}).catch(err => console.error(err));