Security News
npm Updates Search Experience with New Objective Sorting Options
npm has a revamped search experience with new, more transparent sorting options—Relevance, Downloads, Dependents, and Publish Date.
@transifex/native
Advanced tools
A general purpose Javascript library for localizing web apps using Transifex Native.
Requires a Transifex Native Project Token.
Supported Node.js versions >= 10.x.x
Related packages:
Install the library using:
npm install @transifex/native --save
import { tx, t } from '@transifex/native';
// initialize
tx.init({
token: '<PUBLIC PROJECT TOKEN>',
sourceLocale: 'en',
});
async function main() {
// set target language, this will fetch translations Over The Air
await tx.setCurrentLocale('el');
// translate something
const message = t('Welcome {user}', {user: 'Joe'});
console.log(message);
// get supported languages in order to create a language picker
const languages = await tx.getLanguages();
console.log(languages);
/*
[{
name: 'Greek',
code: 'el',
localized_name: 'Ελληνικά',
rtl: false,
},{
...
}]
*/
}
main();
const { tx, t } = require('@transifex/native');
// initialize
tx.init({
token: '<PUBLIC PROJECT TOKEN>',
sourceLocale: 'en',
});
...
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@transifex/native/dist/browser.native.min.js"></script>
<script type="text/javascript">
const tx = Transifex.tx;
const t = Transifex.t;
// initialize SDK
tx.init({
token: '<PUBLIC PROJECT TOKEN>',
sourceLocale: 'en',
});
// get all languages
tx.setCurrentLocale('fr').then(function() {
// translate something
const message = t('Welcome {user}', {user: 'Joe'});
console.log(message);
});
}
</script>
tx.init({
// Public project token, defaults to empty string
token: String,
// Source language locale code
sourceLocale: String,
// Optional list of enabled locales codes for translation
appLocales: Array[String],
// CDS endpoint, defaults to https://cds.svc.transifex.net
cdsHost: String,
// Missing translation policy, defaults to "new SourceStringPolicy()"
missingPolicy: Function,
// Error policy, defaults to "new SourceErrorPolicy()"
errorPolicy: Function,
// Translation cache, defaults to "new MemoryCache()"
cache: Function,
})
Fetches list of project languages from CDS, useful for creating a language picker.
tx.getLanguages(): Promise([
{
name: String,
code: String,
localized_name: String,
rtl: Boolean
},
...
])
// Example
tx.getLanguages().
then(languages => console.log(languages)).
catch(err => console.log(err))
Get a list of available locales based on CDS.
tx.getRemoteLocales(): Promise(['code', 'code',...])
Get a list of app locales based on library initialization.
tx.getAppLocales(): Array(['code', 'code',...])
Get a list of supported locales based on user preference and CDS languages
tx.getSupportedLocales(): Promise(['code', 'code',...])
Fetches translations from the CDS and stores them in cache. When the promise returns, all content will be translated to that language.
tx.setCurrentLocale(localeCode): Promise
// Example
tx.setCurrentLocale('el').
then(() => console.log('content loaded')).
catch(err => console.log(err))
Returns the currently selected language code.
tx.getCurrentLocale(): String(localeCode)
// Example
console.log(tx.getCurrentLocale())
Returns the translation of the passed source string based on the currenly selected language. If the translation is not found, the returned string is handled by the configured missing policy. If an error occurs in the ICU parsing of the string, the error is handled based on the configured error policy.
The translation is returned unescaped and it is NOT safe to be used inside the HTML document unless escaped
t(sourceString, params): String(localizedString)
sourceString: String(ICU syntax string)
params: Object({
// optional string context, affects key generation
_context: String,
// optional developer comment
_comment: String,
// optional character limit instruction for translators
_charlimit: Number,
// optional comma separated list of tags
_tags: String,
// optional custom key
_key: String,
// optionally escape ICU variables
_escapeVars: Boolean,
// ICU variables, plurals, gender etc
...icu variables...
})
// Example
console.log(
t('Hello <b>{username}</b>', { username: 'Joe' })
)
// "Hello <b>Joe</b>"
Using the translation as is from the t
function inside HTML is dangerous for
XSS attacks. The translation must be escaped based on two scenarios.
import { t, escape } from '@transifex/native';
const translation = escape(t('Hello {username}', { username }));
// translation is safe to include in HTML
HTML source content cannot be globally escaped. In that case, we can just escape
the ICU variables using the _escapeVars
parameter.
import { t } from '@transifex/native';
const html = t('<b>Hello {username}</b>', {
username: username,
_escapeVars: true,
});
Library for listening to various async events.
// listen to event
onEvent(type, function)
type:
FETCHING_TRANSLATIONS
TRANSLATIONS_FETCHED
TRANSLATIONS_FETCH_FAILED
LOCALE_CHANGED
FETCHING_LOCALES
LOCALES_FETCHED
LOCALES_FETCH_FAILED
// stop listening event
offEvent(type, function)
// trigger an event
sendEvent(type, payload, caller)
Licensed under Apache License 2.0, see LICENSE file.
FAQs
i18n framework using Transifex Native
The npm package @transifex/native receives a total of 24,432 weekly downloads. As such, @transifex/native popularity was classified as popular.
We found that @transifex/native demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
npm has a revamped search experience with new, more transparent sorting options—Relevance, Downloads, Dependents, and Publish Date.
Security News
A supply chain attack has been detected in versions 1.95.6 and 1.95.7 of the popular @solana/web3.js library.
Research
Security News
A malicious npm package targets Solana developers, rerouting funds in 2% of transactions to a hardcoded address.