Paraglide JS

Paraglide JS

Tool

There are three ways to invoke the Paraglide JS compiler:

  1. Via the Paraglide CLI
  2. Via a bundler plugin
  3. Programatically

[!TIP] Bundler plugins are the recommended approach. They are more flexible and can be integrated into your build pipeline.

Via the Paraglide CLI

[!TIP] For a complete setup guide using CLI compilation with Express, Hono, Fastify, or Elysia, see Standalone Servers. For monorepo setups, see Monorepo Setup.

To compile your messages via the CLI, run the following command:

npx @inlang/paraglide-js compile --project ./project.inlang --outdir ./src/paraglide

To watch files and recompile on change, add the --watch flag:

npx @inlang/paraglide-js compile --project ./project.inlang --outdir ./src/paraglide --watch

Use --help to see all available options:

npx @inlang/paraglide-js compile --help

Via a bundler plugin

Paraglide JS exports bundler plugins via the paraglide<Bundler>Plugin() functions.

  • paraglideRollupPlugin
  • paraglideWebpackPlugin
  • paraglideVitePlugin
  • paraglideRspackPlugin
  • paraglideRolldownPlugin
  • paraglideEsbuildPlugin
  • ... and more plugins supported by unplugin

Vite example

import { defineConfig } from "vite";
import { paraglideVitePlugin } from "@inlang/paraglide-js";

export default defineConfig({
	plugins: [
		paraglideVitePlugin({
			project: "./project.inlang",
			outdir: "./src/paraglide",
		}),
	],
});

Programmatically

The Paraglide compiler can be invoked programatically via the compile function.

import { compile } from "@inlang/paraglide-js";

await compile({
	project: "./project.inlang",
	outdir: "./src/paraglide",
});

If you need/want to extend the compiler, you can use the lower level compileProject function.

import { compileProject } from "@inlang/paraglide-js";
import { loadProjectFromDirectory } from "@inlang/sdk";

const inlangProject = await loadProjectFromDirectory({
	path: "./project.inlang",
});

const output = await compileProject({
	project: inlangProject,
});

console.log(output);