r-localize
About
r-localize is a localization plugin for Riot.js based off of Vue.js v-localize project.
Support
Chome | Edge | Firefox | Opera | Safari |
---|---|---|---|---|
5.0+ ✔ | ✔ | 4.0+ ✔ | 11.50+ ✔ | 5.0+ ✔ |
This project was developed using Riot.js 3, support for previous versions is not available.
Usage
To install via NPM, simply do the following:
npm install r-localize
For a quick start using jsdelivr:
Using the plugin is then as simple as:
const options = debug: true default: 'en-US' fallback: '-' available: 'en-US' 'es-SP' const localizations = 'en-US': 'header': 'international' 'menu': 'help': 'Help' 'es-SP': 'header': 'internacional' 'menu': 'help': 'Ayuda' localize = riot options localizations
Once your Riot app has been mounted, the language can be changed by calling localize.locale(args*)
from your component.
English Spanish
You can specify your localizations like so:
<!-- add a localized title to this element targeting en-US --><!-- replace this element's text with localized item -->
Alternatively, you can fetch your current localization by calling locale
without any arguments.
Current Locale: { localize.locale() }
For fetching a specific locale item programatically within a component method:
<h1>Translated Item: localize </h1>
Configuration
The plugin takes 5 options,
*available
: List of available localizations.
'en-US' 'es-SP' 'pr-BR' locale: 'ar-MS' orientation: 'rtl'
*debug
: Spit info, warnings and errors to console.
*default
: Default locale key to target.
fallbackContent
: Use the existing node's text content if enabled and requested localization is not found.
*fallback
: Default text to show if localization for current language not found.
webStore
: If the mixin is accessed within a web context and optionwebStore
is enabled, mixin will store the locale in local storage for the next visit.
Locale Options
Locale configuration currently supports the following options,
orientation
: Text direction of target element, useful for orientation of script languages.
fontFamily
: Font family to change to. Re: https://www.w3schools.com/jsref/prop_style_fontfamily.asp
Contributors
- John Nolette (john@neetgroup.net)
Contributing guidelines can be found here.
Copyright (c) 2017 John Nolette Licensed under the MIT license.