多言語サイトを構築したい。
※「≈≈≈」は省略を表す
バージョン
$ node -v
v6.2.1
$ cat package.json
{
≈≈≈
"dependencies": {
"ect": "^0.5.9",
"express": "~4.13.1",
"i18n": "~0.8.2",
≈≈≈
},
≈≈≈
}
localesの用意
$ mkdir locales
$ cat locales/en.json
{
"i18ntest": {
"Hello": "Hello world!"
}
}
$ cat locales/ja.json
{
"i18ntest": {
"Hello": "素敵な世界！"
}
}
app.js
≈≈≈
var ect = require('ect');
var i18n = require('i18n');
≈≈≈
// view engine setup
var ectRenderer = ect({ watch: true, root: __dirname + '/views', ext : '.ect' });
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ect');
app.engine('ect', ectRenderer.render);
≈≈≈
// i18n settings
i18n.configure({
locales: ['ja', 'en'],
defaultLocale: 'ja',
directory: __dirname + '/locales',
objectNotation: true
});
app.use(i18n.init);
app.use(function (req, res, next) {
if (req.session.locale) {
i18n.setLocale(req, req.session.locale);
}
next();
});
≈≈≈
使い方
$ cat app.js
≈≈≈
var test = require('../routes/test');
≈≈≈
app.use('/', test);
≈≈≈
$ cat routes/test.js
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('test', {});
}
module.exports = router;
$ cat views/test.ect
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= @__("i18ntest.Hello") %></title>
</head>
<body>
<h1><%= @__("i18ntest.Hello") %></h1>
</body>
</html>
確認方法
ブラウザの言語設定を日本語/英語にしてアクセス
例）Chrome(51.0.2704.103 (64-bit))：英語：
応用編
$ cat routes/test.js
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('test', { message: 'Hello' });
}
module.exports = router;
$ cat views/test.ect
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= @__("i18ntest.Hello") %></title>
</head>
<body>
<h1><%= @__("i18ntest." + @message) %></h1>
</body>
</html>