Skip to content

Example: React SDK with the Vite plugin (blocked) #5

Open

Description

@sapatmohit

Add a React + Vite example that uses the Babelize SDK (@babelize/sdk + @babelize/vite) instead of the CLI: you write babelize("Welcome back") in components, and the build plugin translates the strings into babelize-lock.json. See the blog post i18n without translation keys.

Blocked: the Vite plugin only accepts a Babelize API key, so translations come from the hosted open-source model, and a later build would overwrite reviewed translations in the lockfile. A draft of the app exists and builds; it's waiting until the plugin can use your own LLM key, or keep reviewed lockfile entries.

Known SDK issues found while drafting it:

  • The plugin finds strings only in calls named babelize(...), so the hook result must be named babelize, not t.
  • There are no TypeScript types for virtual:babelize-lockfile, so you have to add a declare module.
  • The Vite plugin writes the lockfile after the bundle is emitted, so a fresh checkout needs two builds.

Folder: react-vite-sdk. Same app and design as the other examples. The structure differs: one commit with the app using the SDK, then one with the generated lockfile and the review fixes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions