Skip to content

cutsin/template-string-i18n

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

34 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Template String I18n

I18n using template strings with auto save/load translate documents. Inspired by jaysoo.ca.

Installation

yarn add template-string-i18n --dev
# or
npm i template-string-i18n --save-dev

Example

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>

Usage

Edit package.json

{
  "languages": [
    "en-US",
    "de-AT",
    "zh-Hans-CN"
  ]
}

for Babel & Eslint

.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 }
}

for Pug

const pug = require('pug')
console.log(pug.renderFile('tmpl.pug', { __: i18n.__ }))

for vue-loader

var i18n = require('template-string-i18n/lib/i18n')
...
module.exports = {
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
          loaders: ...,
          // for pugjs
          template: {
            __: i18n.__
          }
        }
      }
    ]
  }
}

How to build

  1. 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)
    		}
    	}
    	```
  2. Put [build.sample.sh] to your repo's root path

  3. Run sh build.sample.sh

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Packages

No packages published