Question

我正在使用Meteor构建一个webapp。

我的webapp将使用不同语言的相同UI（和页面）。它将在不同的ccTLD（.cz，.sk，.hu，.tr，... .com）上进行本地化和部署。

这是我想要的类似情况。这是一个czech parfums eshop。向下滚动时，会有不同域的标记（链接）。

我的网络应用可以分解为：

[DB]数据库可以用于多种语言。
[common-code]大多数代码在不同语言之间是相同的
[路由＆amp; i18n]每种语言的不同部分是路由文件和i18n文件

应该有一些方法来构建/运行/调试具有不同路由文件和i18n文件的应用程序。

我不想拥有一个.com域名并且能够切换语言。 Why?

Answer 1

考虑将一个代码库与国际化文件一起使用。您可以使用tap-i18n软件包（https://github.com/TAPevents/tap-i18n）以及iron-router和iron-router-i18n软件包（https://github.com/yoolab/iron-router-i18n）。例如：

meteor create intl
meteor add tap:i18n
meteor add iron:router
meteor add martino:iron-router-i18n

这创建了一个用于演示目的的基本项目，并添加了tap-i18n，iron-router和iron-router-i18n软件包。

我们假设我们想要支持英语，西班牙语和法语。创建一个i18n目录来存储国际化文件。这些文件包含为各种版本的网站翻译的文本字符串（对不起，如果我的翻译不完美）：

I18N / en.i18n.json：

{
        "settings": "settings",
        "home": "home",
        "welcome text": "Welcome to Meteor!",
        "home text": "This is the home page.",
        "settings text": "On this page you can modify settings."
}

I18N / es.i18n.json：

{
        "settings": "configuracion",
        "home": "inicial",
        "welcome text": "Bienvenido a Meteoro!",
        "home text": "Esta es la pagina de inicio.",
        "settings text": "En esta pagina usted puede modificar la configuracion."
}

I18N / fr.i18n.json：

{
        "settings": "parametres",
        "home": "premiere",
        "welcome text": "Bienvenue au Meteor!",
        "home text": "Cette page est la page d'accueil.",
        "settings text": "Sur cette page vous pouvez modifier les parametres."
}

请注意，文件名以语言代码（en，es，fr）开头。我正在使用http://www.iana.org/assignments/language-subtag-registry/language-subtag-registry中的代码列表，但代码并不重要，因为您稍后在iron-router-i18n配置中正确引用它。

现在为应用程序创建一个settings.json文件，以指定要用于当前部署的语言。在这里我使用'es'代表西班牙语（同样，这必须与上面用于你的i18n文件的前缀相匹配）：

settings.json：

{
  "public": {
    "i18nLanguageCode": "es"
  }
}

这是每个部署需要修改的唯一文件。

在启动应用程序时，我们调用TAPi18n setLanguage函数，传递来自settings.json文件的值，然后我将注册一个全局模板助手来获取当前语言：

intl.js：

if (Meteor.isClient) {

  TAPi18n.setLanguage(Meteor.settings.public.i18nLanguageCode);

  Template.registerHelper("getCurrentLanguage", function(){
    return Meteor.settings.public.i18nLanguageCode;
  });

}

这是intl.html文件：

<template name="layout">
  <h1>{{_ "welcome text"}}</h1>

  {{> yield}}
</template>

<template name="home">
  <p>{{_ "home text"}}</p>
  <p><a href="{{pathFor route='settings' lang=getCurrentLanguage}}">{{_ "settings"}}</a></p>
</template>

<template name="settings">
  <p>{{_ "settings text"}}</p>
  <p><a href="{{pathFor route='home' lang='en'}}">{{_ "home"}}</a></p>
</template>

注意tap-i18n包提供的帮助器（下划线后跟引号中的字符串）。这些占位符（“欢迎文本”，“主页文本”，“设置文本”，“设置”，“主页”）将替换为我们创建的i18n文件中的正确翻译文本。 getCurrentLanguage函数将当前语言代码传递给iron-router-i18n pathFor helper。

现在让我们创建路由器配置。

router.js：

I18NConf.configure({
  defaultLanguage: 'en',
  languages: [Meteor.settings.public.i18nLanguageCode],
  autoConfLanguage: true
});

Router.configure({
  layoutTemplate: 'layout',
  i18n: {
    compulsoryLangCode: false,
    langCodeForDefaultLanguage: false,
    addLangCode: function(url){
      return url;
    },
    langCodeAction: function(path){
      /* by default Router.setLanguage would be called and we do not want that */
    }
  }
});

Router.route('/', function() {
  this.render('home');
}, {
  name: 'home'
});

Router.route('settings', function() {
  this.render('settings');
}, {
  i18n: {
    languages: {
      es: { path: '/ajustes' },
      fr: { path: '/parametres'}
    }
  }
});

请注意，我正在将Meteor.settings.public.i18nLanguageCode传递给I18NConf.configure，并且对于您想要转化路径的每条路线，您需要添加配置：

  i18n: {
    languages: {
      es: { path: '/ajustes' },
      fr: { path: '/parametres'}
    }
  }

运行meteor时，使用设置文件运行它：

meteor run --settings settings.json

我在这里创建了一个样本仓库：https://github.com/markleiber/intl

为不同的ccTLD构建相同的Web

1 个答案: