0.3.0 • Published 8 months ago

@rechunk/babel-plugin v0.3.0

Weekly downloads
-
License
MIT
Repository
-
Last release
8 months ago

@rechunk/babel-plugin

Babel plugin for transforming and processing ReChunk directives in React Native applications.

Features

  • 🎯 Transforms use rechunk directives
  • 🔄 Automatic code splitting support
  • ⚡️ Dynamic imports generation
  • 🛡️ Secure token handling
  • 🔍 Path alias resolution
  • 📦 React Native optimization

Installation

npm install --save-dev @rechunk/babel-plugin

# or with yarn
yarn add -D @rechunk/babel-plugin

# or with pnpm
pnpm add -D @rechunk/babel-plugin

Usage

Basic Configuration

// babel.config.js
module.exports = {
  plugins: ['@rechunk/babel-plugin'],
};

With React Native

// babel.config.js
const {withReactNativeBabelPresetOptions} = require('@rechunk/babel-plugin');

module.exports = {
  presets: [
    [
      'module:metro-react-native-babel-preset',
      api => withReactNativeBabelPresetOptions(api),
    ],
  ],
  plugins: ['@rechunk/babel-plugin'],
};

With Expo

// babel.config.js
const {withBabelPresetExpoOptions} = require('@rechunk/babel-plugin');

module.exports = {
  presets: [['babel-preset-expo', api => withBabelPresetExpoOptions(api)]],
  plugins: ['@rechunk/babel-plugin'],
};

Features

Directive Transform

// Input
'use rechunk';
export default function MyComponent() {
  return <View>...</View>;
}

// Output
import React from 'react';
import {importChunk} from '@rechunk/core';

const $$ReChunkModule = React.lazy(() => importChunk('base64-encoded-path'));
export default $$ReChunkModule;

Environment Support

# Production mode
RECHUNK_ENVIRONMENT=prod

# Development mode
RECHUNK_ENVIRONMENT=dev

# Offline mode
RECHUNK_ENVIRONMENT=offline

Configuration

.rechunkrc.json

{
  "host": "https://your-rechunk-host.com",
  "project": "your-project-id",
  "readKey": "your-read-key",
  "publicKey": "your-public-key",
  "external": ["optional-external-dependency"]
}

API Reference

withReactNativeBabelPresetOptions

function withReactNativeBabelPresetOptions(
  api: ConfigAPI,
  options: Record<string, unknown> = {},
): Record<string, unknown>;

withBabelPresetExpoOptions

function withBabelPresetExpoOptions(
  api: ConfigAPI,
  options: BabelPresetExpoOptions = {},
): BabelPresetExpoOptions;

Contributing

Contributions are welcome! Please read our contributing guidelines first.

License

MIT