I18n using template strings with auto save/load translate documents. Inspired by jaysoo.ca.
yarn add template-string-i18n --dev
# or
npm i template-string-i18n --save-dev
myproject/languages/en-US.json
{ "Hi {0}": "Hello {0}" }
myproject/app.js
let foo = 'bar'
__`Hi ${foo}`
// >> Hello bar
myproject/tmpl.pug
h1= __`Hi ${foo}`
//- >> <h1>Hello bar</h1>
{
"languages": [
"en-US",
"de-AT",
"zh-Hans-CN"
]
}
.babelrc
{
// Babel 6
"plugins": ["transform-runtime", "template-string-i18n"]
// Babel 7
"plugins": ["@babel/transform-runtime", "module:template-string-i18n"]
}
.eslintrc.js
module.exports = {
...
globals: { __: false }
}
const pug = require('pug')
console.log(pug.renderFile('tmpl.pug', { __: i18n.__ }))
var i18n = require('template-string-i18n/lib/i18n')
...
module.exports = {
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: ...,
// for pugjs
template: {
__: i18n.__
}
}
}
]
}
}
-
Modify your webpack config
var lang = (process.env.LANG || process.env.LOCALE || '') if (lang) lang = '/' + lang module.exports = { /* ... */ build: { index: path.resolve(__dirname, '../dist' + lang + '/index.html'), assetsRoot: path.resolve(__dirname, '../dist' + lang) } } ```
-
Put [build.sample.sh] to your repo's root path
-
Run
sh build.sample.sh