mpodriezov/express_i18n_nunjucks.js

## express_i18n_nunjucks.js
// usual requirements
const express = require('express');
const cookieParser = require('cookie-parser');
const i18n = require('i18n');
const nunjucks = require('nunjucks');
const app = module.exports = express();

i18n.configure({
  // setup some locales - other locales default to en silently
  locales: ['en', 'fr', 'de', 'ru'],
  queryParameter: "lang",
  // sets a custom cookie name to parse locale settings from
  cookie: 'lang_cookie_name',

  // where to store json files - defaults to './locales'
  directory: __dirname + '/locales'
});

// set default express engine and extension
app.engine('html', nunjucks.render);
app.set('view engine', 'njk');

// you will need to use cookieParser to expose cookies to req.cookies
app.use(cookieParser());

// i18n init parses req for language headers, cookies, etc.
app.use(i18n.init);


// configure nunjucks environment
const env = nunjucks.configure('views', {
  express: app //integrate nunjucks into express
});
env.addGlobal("__", i18n.__);
env.addFilter("t", i18n.__);


// serving homepage
app.get('/', function (req, res) {
  const templateData = {
    date: new Date()
  };
  res.render('home', {templateData});
});

// starting server
app.listen(3000);

## locales.js
// Put into separate json files inside ./locales folder

// locales/de.json
{
	"home.title": "Dies ist die Homepage",
	"home.p": "Bitte wählen Sie Ihre Sprache",
	"lng.english": "Englisch",
	"lng.french": "Französisch",
	"lng.german": "Deutsche",
	"lng.rus": "Russisch"
}

// locales/en.json
{
	"home.title": "This is home page",
	"home.p": "Select the language",
	"lng.english": "English",
	"lng.french": "French",
	"lng.german": "German",
	"lng.rus": "Russian",
	"server.date": "<small>Server time: {{ date }}</small>"
}

// locales/fr.json
{
	"home.title": "C'est la page d'accueil",
	"home.p": "Choisissez la langue",
	"lng.english": "Anglaise",
	"lng.french": "Française",
	"lng.german": "Allemande",
	"lng.rus": "Russe"
}

// locales/ru.json
{
	"home.title": "Это домашняя страница",
	"home.p": "Выберите язык",
	"lng.english": "Английский",
	"lng.french": "Французский",
	"lng.german": "Немецкий",
	"lng.rus": "Русский"
}

## package.json
{
  "name": "express-i18n-nunjucks-gist",
  "description": "Example gist for how to setup the express 4, i18n and nunjucks",
  "version": "1.0.0",
  "scripts": {
    "start": "node express_i18n_nunjucks.js"
  },
  "engines": {
    "node": ">=10.15"
  },
  "engineStrict": true,
  "dependencies": {
    "cookie-parser": "^1.4.4",
    "express": "^4.17.1",
    "i18n": "^0.8.3",
    "nunjucks": "^3.2.0"
  },
  "devDependencies": {}
}

## views.njk
<!-- Put into the ./views folder -->

<!--  views/home.njk -->
{% extends "layout.njk" %}
{% block title %}{{ __('home.title') }}{% endblock %}
{% block content %}
  <h1>{{ __('home.title') }}</h1>
  <p>{{ __('home.p') }}</p>
  <p>{{ 'server.date' | t(templateData) | safe }}</p>
  <a href="?lang=en">{{ 'lng.english' | t }}</a>
  <a href="?lang=fr">{{ __('lng.french') }}</a>
  <a href="?lang=de">{{ __('lng.german') }}</a>
  <a href="?lang=ru">{{ __('lng.rus') }}</a>
{% endblock %}

<!--  views/layout.njk -->
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
  <meta charset="utf8"/>
  <meta name="viewport" content="width=device-width"/>
</head>
<body>{% block content %} {% endblock %}</body>
</html>
	// usual requirements
	const express = require('express');
	const cookieParser = require('cookie-parser');
	const i18n = require('i18n');
	const nunjucks = require('nunjucks');
	const app = module.exports = express();

	i18n.configure({
	// setup some locales - other locales default to en silently
	locales: ['en', 'fr', 'de', 'ru'],
	queryParameter: "lang",
	// sets a custom cookie name to parse locale settings from
	cookie: 'lang_cookie_name',

	// where to store json files - defaults to './locales'
	directory: __dirname + '/locales'
	});

	// set default express engine and extension
	app.engine('html', nunjucks.render);
	app.set('view engine', 'njk');

	// you will need to use cookieParser to expose cookies to req.cookies
	app.use(cookieParser());

	// i18n init parses req for language headers, cookies, etc.
	app.use(i18n.init);


	// configure nunjucks environment
	const env = nunjucks.configure('views', {
	express: app //integrate nunjucks into express
	});
	env.addGlobal("__", i18n.__);
	env.addFilter("t", i18n.__);


	// serving homepage
	app.get('/', function (req, res) {
	const templateData = {
	date: new Date()
	};
	res.render('home', {templateData});
	});

	// starting server
	app.listen(3000);
	// Put into separate json files inside ./locales folder

	// locales/de.json
	{
	"home.title": "Dies ist die Homepage",
	"home.p": "Bitte wählen Sie Ihre Sprache",
	"lng.english": "Englisch",
	"lng.french": "Französisch",
	"lng.german": "Deutsche",
	"lng.rus": "Russisch"
	}

	// locales/en.json
	{
	"home.title": "This is home page",
	"home.p": "Select the language",
	"lng.english": "English",
	"lng.french": "French",
	"lng.german": "German",
	"lng.rus": "Russian",
	"server.date": "<small>Server time: {{ date }}</small>"
	}

	// locales/fr.json
	{
	"home.title": "C'est la page d'accueil",
	"home.p": "Choisissez la langue",
	"lng.english": "Anglaise",
	"lng.french": "Française",
	"lng.german": "Allemande",
	"lng.rus": "Russe"
	}

	// locales/ru.json
	{
	"home.title": "Это домашняя страница",
	"home.p": "Выберите язык",
	"lng.english": "Английский",
	"lng.french": "Французский",
	"lng.german": "Немецкий",
	"lng.rus": "Русский"
	}
	{
	"name": "express-i18n-nunjucks-gist",
	"description": "Example gist for how to setup the express 4, i18n and nunjucks",
	"version": "1.0.0",
	"scripts": {
	"start": "node express_i18n_nunjucks.js"
	},
	"engines": {
	"node": ">=10.15"
	},
	"engineStrict": true,
	"dependencies": {
	"cookie-parser": "^1.4.4",
	"express": "^4.17.1",
	"i18n": "^0.8.3",
	"nunjucks": "^3.2.0"
	},
	"devDependencies": {}
	}
	<!-- Put into the ./views folder -->

	<!-- views/home.njk -->
	{% extends "layout.njk" %}
	{% block title %}{{ __('home.title') }}{% endblock %}
	{% block content %}
	<h1>{{ __('home.title') }}</h1>
	<p>{{ __('home.p') }}</p>
	<p>{{ 'server.date' \| t(templateData) \| safe }}</p>
	<a href="?lang=en">{{ 'lng.english' \| t }}</a>
	<a href="?lang=fr">{{ __('lng.french') }}</a>
	<a href="?lang=de">{{ __('lng.german') }}</a>
	<a href="?lang=ru">{{ __('lng.rus') }}</a>
	{% endblock %}

	<!-- views/layout.njk -->
	<html>
	<head>
	<title>{% block title %}{% endblock %}</title>
	<meta charset="utf8"/>
	<meta name="viewport" content="width=device-width"/>
	</head>
	<body>{% block content %} {% endblock %}</body>
	</html>