#Getting started
To use Paraglide standalone without a framework, run the following command:
npx @inlang/paraglide-js@latest init
This will:
- Install necessary dependencies
- Generate a
messages/
folder where your translation files live - Add the Paraglide compiler to your
build
script inpackage.json
- Create necessary configuration files
Running the Paraglide compiler will generate a src/paraglide
folder. This folder contains all the code that you will use in your app.
#Adding and Editing Messages
Messages are stored in messages/{lang}.json
as key-value pairs. You can add parameters with curly braces.
// messages/en.json
{
"$schema": "https://inlang.com/schema/inlang-message-format",
+ "greeting": "Hello {name}!"
}
Make sure to re-run the paraglide compiler after editing your messages.
npx @inlang/paraglide-js compile --project ./project.inlang --outdir ./src/paraglide
If you are using a Bundler use one of the Bundler Plugins to recompile automatically.
#Using Messages in Code
After running the compiler import the messages with import * as m from "./paraglide/messages"
. By convention, a wildcard import is used.
import * as m from "./paraglide/messages.js"
m.hello() // Hello world!
m.loginHeader({ name: "Samuel" }) // Hello Samuel, please login to continue.
#Playground
Find examples of how to use Paraglide on CodeSandbox or in our GitHub repository
#Roadmap
Of course, we're not done yet! We plan on adding the following features to Paraglide JS soon:
- Pluralization (Join the Discussion
) - Formatting of numbers and dates (Join the Discussion
) - Markup Placeholders (Join the Discussion
) - Component Interpolation
- Per-Language Splitting without Lazy-Loading
- Even Smaller Output
#Talks
- Svelte Summit Spring 2023
- Svelte Summit Fall 2023
- Web Zurich December 2023
- Svelte London January 2024