Internationalization for svelte framework. Based on i18next ecosystem

Last update: Dec 9, 2022

Overview

svelte-i18next

Svelte wrapper for i18next

npm i svelte-i18next i18next

Implementation

This library wraps an i18next instance in a Svelte Store to observe i18next events so your Svelte components re-render e.g. when language is changed or a new resource is loaded by i18next.

Quick Start

i18n.js:

import i18next from "i18next";
import { createI18nStore } from "svelte-i18next";

i18next.init({
 lng: 'en',
 resources: {
    en: {
      translation: {
        "key": "hello world"
      }
    }
  },
  interpolation: {
    escapeValue: false, // not needed for svelte as it escapes by default
  }
});

export const i18n = createI18nStore(i18next);

App.svelte:

<script>
  import i18n from './i18n.js';
</script>

<div>
    {$i18n.t('key')}
</div>

See full example project: Svelte example

A documentation site for the Aries JavaScript ecosystem.

Aries JavaScript Documentation Getting started | Contributing | License Aries JavaScipt is an ecosystem of self-sovereign identity development tools,

Nov 16, 2022

Documentation: PWA integrations for Vite and the ecosystem

Documentation: PWA integrations for Vite and the ecosystem 🚀 Features 📖 Documentation & guides 👌 Zero-Config: sensible built-in default configs for

Dec 28, 2022

A fully type-safe and lightweight internationalization library for all your TypeScript and JavaScript projects.

🌍 typesafe-i18n A fully type-safe and lightweight internationalization library for all your TypeScript and JavaScript projects. Advantages 🐤 lightwe

Jan 4, 2023

Simple and Extensible Markdown Parser for Svelte, however its simplicity can be extended to any framework.

svelte-simple-markdown This is a fork of Simple-Markdown, modified to target Svelte, however due to separating the parsing and outputting steps, it ca

May 22, 2022

Trying to learn Svelte. Based off the official tutorial. Readme has notes!

Learning Svelte! A JavaScript library An open-source front end compiler Instead of using a virtual DOM, Svelte will directly update the DOM in an effi

Jul 5, 2022

ui components library starter based on svelte.js

What 这是一个svelte组件库的starter。可以用它构建自己或者团队的组件库。好处是：无论用户使用什么前端框架（Vue, React, Angular等），都可以引用基于svelte构建的组件库里的组件。因为svelte编译完的组件其实是js模块，即无框架组件。技术栈：vite +

Nov 27, 2022

Might be mineral fish site in future, idk. Currently just a fish list. Made with Svelte

Might be mineral fish site in future, idk. Currently just a fish list. Made with Svelte. Built version (used at mineralfish.github.io) at the build branch. Build steps and original README below.

Nov 3, 2022

An Electron app using NAPI-RS and a native Rust module to implement a Svelte store.

Svelte Store Written in Rust This repo shows a demo of an Electron app running a Svelte UI that reads and writes a Svelte store, but with a twist: the

Sep 20, 2022

Svelte debugging tool for re-rendering components

resvelte README This is the README for your extension "resvelte". After writing up a brief description, we recommend including the following sections.

Oct 4, 2022

Comments

Add isLoading flag for a fallback
Creates a writable for the isLoading attribute

checks if some locales are loaded, if none, set loading to true, false otherwise.

also checks for failed loading for a given locale, sets loading to true in cases of failed loading.
opened by NishuGoel 0
Launch Support 🚀
Polished the library a bit to be ready for prime-time

Added MIT LICENSE

Separated the example Svelte project from the library module

Simplified and updated README to follow npm conventions

Added metadata to package.json

Added GitHub Actions to automate publishing by pushing a version tag

Added a simple unit test to ensure the module API
opened by anttiviljami 0
lang in url (with sveltekit)

Hi, thanks for this library!

I'm trying to use it with sveltekit. I have a path like /[lang]/about. Because I want to use i18n on all pages, and initialize it only once, I do so in /[lang]/+layout.svelte. How do I then access the i18n store in /[lang]/about/+page.svelte?

opened by Jan-Jan 2
feature idea: Trans component
It would be awesome to have also something like a Trans component, like in react-i18next.

That would help to interpolate components/html elements...

<Trans i18nKey="test.key"> Hi from <a href="https://www.i18next.com" target="_blank" rel="noopener">i18next</a> 👋 </Trans>
opened by adrai 3

Owner

Nishu Goel

Web GDE; MVP; Engineer - JavaScript, React/Angular, Golang;

GitHub

Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

3 May 18, 2022

Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

4 May 3, 2022

Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

14 Jan 3, 2023

Vite plugin to client bundle i18next locales composited from one to many json/yaml files from one to many libraries. Zero config HMR support included.

vite-plugin-i18next-loader yarn add -D vite-plugin-i18next-loader Vite plugin to client bundle i18next locales composited from one to many json/yaml f

4 Nov 30, 2022

⚗️Nitro provides a powerful toolchain and a runtime framework from the UnJS ecosystem to build and deploy any JavaScript server, anywhere

1.3k Jan 5, 2023

Bun-Bakery is a web framework for Bun. It uses a file based router in style like svelte-kit. No need to define routes during runtime.

Bun Bakery Bun-Bakery is a web framework for Bun. It uses a file based router in style like svelte-kit. No need to define routes during runtime. Quick

44 Dec 6, 2022

Internationalization for svelte framework. Based on i18next ecosystem

Related tags