Installation

Install anylang-dev and configure it for Vite or Next.js.

Use the framework tabs below to pick your setup path. Tabs with the same title stay synchronized across the page.

Install

Vite

npm install --save-dev anylang-dev
npx anylang init

Next.js

npm install --save-dev anylang-dev
npx anylang init

Configure your framework

Vite

Add the anylang plugin before your React plugin in vite.config.ts.

vite.config.ts

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import anylang from "anylang-dev/vite";

export default defineConfig({
  plugins: [anylang(), react()],
});

If you use TypeScript and tr="false", add the JSX type augmentation once.

src/vite-env.d.ts

import "anylang-dev/jsx-runtime";

Next.js

Wrap your Next config with anylang in next.config.mjs.

next.config.mjs

import anylang from "anylang-dev/next";

const nextConfig = {};

export default anylang({
  runtimeImport: "@/anylang",
})(nextConfig);

If you use TypeScript and tr="false", add the JSX type augmentation in a global declaration file.

anylang-env.d.ts

import "anylang-dev/jsx-runtime";

Update your package.json scripts to use the --webpack flag, as Next.js Turbopack is not supported by the plugin yet.

package.json

"scripts": {
  "dev": "next dev --webpack",
  "build": "next build --webpack",
  "start": "next start",
  "lint": "eslint"
}