https://github.com/cutsin/template-string-i18n
https://github.com/cutsin/template-string-i18n
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/cutsin/template-string-i18n
- Owner: cutsin
- Created: 2017-05-16T05:38:08.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-12-04T05:11:47.000Z (about 7 years ago)
- Last Synced: 2025-04-07T21:06:50.299Z (8 months ago)
- Language: JavaScript
- Size: 20.5 KB
- Stars: 5
- Watchers: 1
- Forks: 4
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-vue-zh - 模板字符串,国际化 - I18n使用模板字符串和自动保存/加载翻译文档. (公用事业 / 国际化)
- awesome-vue - template-string-i18n - Millions of developers and companies build, ship, and maintain their software on GitHub — the largest and most advanced development platform in the world. (Utilities [🔝](#readme))
- awesome-vue - template-string-i18n - I18n using template strings with auto save/load translate documents. (Components & Libraries / Utilities)
- awesome-vue - template-string-i18n ★1 - I18n using template strings with auto save/load translate documents. (Utilities / i18n)
- awesome-vue - template-string-i18n - I18n using template strings with auto save/load translate documents. (Utilities / i18n)
README
# Template String I18n
I18n using template strings with auto save/load translate documents.
Inspired by [jaysoo.ca](https://jaysoo.ca/2014/03/20/i18n-with-es2015-template-literals/).
## Installation
```bash
yarn add template-string-i18n --dev
# or
npm i template-string-i18n --save-dev
```
## Example
__myproject/languages/en-US.json__
```json
{ "Hi {0}": "Hello {0}" }
```
__myproject/app.js__
```javascript
let foo = 'bar'
__`Hi ${foo}`
// >> Hello bar
```
__myproject/tmpl.pug__
```pug
h1= __`Hi ${foo}`
//- >>
Hello bar
```
## Usage
### Edit `package.json`
```json
{
"languages": [
"en-US",
"de-AT",
"zh-Hans-CN"
]
}
```
### for Babel & Eslint
__.babelrc__
```javascript
{
// Babel 6
"plugins": ["transform-runtime", "template-string-i18n"]
// Babel 7
"plugins": ["@babel/transform-runtime", "module:template-string-i18n"]
}
```
__.eslintrc.js__
```javascript
module.exports = {
...
globals: { __: false }
}
```
### for Pug
```javascript
const pug = require('pug')
console.log(pug.renderFile('tmpl.pug', { __: i18n.__ }))
```
### for vue-loader
```javascript
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
```javascript
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`