defineConfig

Configures your Granite application by defining key settings in granite.config.ts.

The configuration lets you specify:

• How users will access your app through a URL scheme (e.g. granite://)
• Your app's unique name that appears in the URL (e.g. granite://my-service)
• Build settings for bundlers like ESBuild and Metro
• Code transformation settings through Babel
• Additional functionality through Granite plugins

Signature

function defineConfig({
  appName,
  scheme,
  plugins,
  outdir,
  entryFile,
  cwd,
  mpack,
  babel,
  esbuild,
  metro,
}: GraniteConfigInput): Promise<GraniteConfigResponse>

Parameters

• configrequired · GraniteConfigInput
  

  Configuration options for your Granite application that define key settings like URL scheme, app name, build settings, and plugins.

The configuration options include:

• appName: Your app's unique identifier that appears in URLs (e.g., 'my-service')
• scheme: URL scheme for launching your app (e.g., 'granite')
• plugins: Granite plugins to enhance functionality
• outdir: Where to output build files (defaults to 'dist')
• entryFile: Your app's entry point (defaults to './src/_app.tsx')
• cwd: Working directory for build process (defaults to process.cwd())
• mpack: Fine-tune mpack bundler behavior
• babel: Customize Babel transpilation
• esbuild: Adjust ESBuild bundling
• metro: Configure Metro bundler settings

Example

Basic Configuration

Here's a basic configuration that:

• Makes your app accessible via the granite:// scheme
• Names your service "my-app" so it's reachable at granite://my-app
• Uses the Hermes plugin to optimize JavaScript bundles into bytecode

import { defineConfig } from '@granite-js/react-native/config';
import { hermes } from '@granite-js/plugin-hermes';

export default defineConfig({
  // The name of your microservice
  appName: 'my-app',
  // The URL scheme for deep linking
  scheme: 'granite',
  // Entry file path
  entryFile: 'index.ts',
  // Array of plugins to use
  plugins: [hermes()],
});