insert-i18n

Insert i18n data from json files into html

Usage no npm install needed!

<script type="module">
  import insertI18n from 'https://cdn.skypack.dev/insert-i18n';
</script>

README

insert-i18n

insert-i18n

Utility for inlining i18n data into HTML files from json files. You can use it programmatically or as CLI.

It is inspired by this html and initially written for the NodeSchool website.

Usage: insert-i18n <html-files-glob> <languages-dir>

Every html file has to include a tag with the id i18n like this

  <span id="i18n" style="display:none; visibility:hidden;">

That is where the translations are going to be inserted.

The script will look in the given languages-dir for a languages.json file. For every key in that JSON file it will look for a <key>.json file. This key/value data is going to be inserted like this:

  1. The script looks for all data-18n attributes in each html file from the glob
  2. For every one of these attributes it will look for the key in all the given languages
  3. It will add a span <span lang="<lang>" data-i18n="<key>"><value></span> like this to the #i18n element.