i18next 초기화 순서로드

Question

i18next를 올바르게 초기화하고 적절한 변환 문자열을 가져 오는 데 문제가 있습니다. 믹스에 몇 가지 라이브러리가 있습니다

• 폰갭 3.x를
• Backbone.js
• Require.js
• i18next.js
• handlebars.js

내 app.js는 document.ready 함수에 대해 다음을가집니다.

$(document).ready(function() { 
    var lang = "", 
     locale = "en-AU"; // default 

    // get the user's locale - mobile or web 
    if (typeof navigator.globalization !== 'undefined') { 
     // on mobile phone 
     navigator.globalization.getLocaleName(
      function (loc) {locale = loc.value; }, 
      function() {console.log('Error getting locale\n'); } 
     ); 
    } else { 
     // in web browser 
     lang = navigator.language.split("-"); 
     locale = lang[0]; 
    } 
    console.log("locale: %s", locale); 

    i18n.init({ 
     lng: locale, 
     debug: true, 
     fallbackLng: 'en' 
    }, function() { 
     // i18next is done asynchronously; this is the callback function 
     $("body").i18n(); 
    }); 

아쉽게도 코드는 내가 설정 한 document.ready 중단 점을 치지 않습니다. 대신, router.js 먼저 View 클래스의 초기화 코드를 호출 정의 :

define(function (require) { 

"use strict"; 

var $   = require('jquery'), 
    Backbone = require('backbone'), 
    Handlebars = require('handlebars'), 
    i18next  = require('i18next'), 
    HomeView = require('app/views/HomeView'), 
    homeView = new HomeView(); // <<-- this line 

을 ... Homeview.js : 페이지로드시

define(function (require) { 

"use strict"; 

var $    = require('jquery'), 
    Handlebars  = require('handlebars'), 
    Backbone  = require('backbone'), 
    i18next   = require('i18next'), 
    tplText   = require('text!tpl/Home.html'), 
    template = Handlebars.compile(tplText); 


return Backbone.View.extend({ 
    initialize: function() { 
     this.render(); 
    }, 
    render: function() { 
     this.$el.i18n(); // << causes an error 
     this.$el.html(template()); 

     return this; 
    } 
    }); 
}); 

을하는 형식 오류가 발생합니다 :

'Undefined' is not a function (evaluating 'this.$el.i18n()') 

내가 뭘 잘못하고있어?

---

편집 : (심 포함) app.js에 require.config 블록 : 나는 백본 및 require.js와 국제화를 사용하는 방법에 대한 데모 응용 프로그램을 만든

require.config({ 

baseUrl: 'lib', 
paths: { 
    app: '../js', 
    'i18next': 'i18next.amd-1.7.2', 
    tpl: '../tpl' 
}, 
map: { 
    '*': { 
     'app/models': 'app/models/memory' 
    } 
}, 
shim: { 
    'handlebars': { 
     exports: 'Handlebars' 
    }, 
    'backbone': { 
     deps: ['underscore', 'jquery'], 
     exports: 'Backbone' 
    }, 
    'underscore': { 
     exports: '_' 
    }, 
    'i18next': ['jquery'] 
} 
}); 

Answer 1

. github repository에서 코드를 다운로드 할 수 있습니다.

공유 한 로그를 기반으로합니다. 일반 i18next.js를 사용하고 있고 j18next가 jQuery보다 먼저 다운로드 될 때 문제가 있다고 생각합니다. 이 issue을보십시오.

대신 AMD 버전, 특히 jQuery 버전을 다운로드하십시오. 다음은 link입니다. 이 버전에는 jQuery가 포함되어 있지 않으며 단지 의존성을 도입한다는 점에 유의하십시오.

jQuery를 추가하고 심 구성에서 i18next을 제거 : 미래에이 질문 건너 그들을 위해

shim: { 
'handlebars': { 
    exports: 'Handlebars' 
}, 
'backbone': { 
    deps: ['underscore', 'jquery'], 
    exports: 'Backbone' 
}, 
'underscore': { 
    exports: '_' 
}, 
'jquery': { 
    exports: '$' 
} 

}

Answer 2

, 나는 마니의 예를 사용하여 작업 일 및 다른 비틀기를 얻을 수 있었다 . 염두에 두어야 할 몇 가지 문제점이 있습니다.

1. 초기화 순서가 올바른지 확인하십시오. i18next를 사용하는 클래스는 i18next.init 호출이 반환 될 때까지 초기화를 유지해야합니다.

2. translations.json 파일에서 잘못된 json을 확인하십시오. i18next 가끔은 i18next의 압축되지 않은 버전을 사용하는 경우 문제가 있음을 알려줍니다.js,하지만 http://jsonlint.com/ 같은 것을 사용하면 json에 문제가 없는지 확인하는 것이 좋습니다.

3. 가변 치환은 i18next에서 흥미 롭습니다. 이중 밑줄과 tr 핸들바 도우미를 사용하십시오.

희망하지 않는 뻔뻔한 플러그

은 - 당신이 부분이 함께 맞는 방법의 예를 필요로하는 경우, 내 프로젝트의 repo는 여기에 있습니다 : https://github.com/adapt-it/adapt-it-mobile. 현지화에 중요한 파일은 다음과 같습니다

• WWW/app.js (i18next.js에 대한 require.js 배관, i18next.init을 위해 전화)
• www /에서 router.js (템플릿 HTML에 대한 핸들 도우미) 당신이 AMD와 정상 i18next 또는 i18next을 사용하고 있는지
• www /에서 TPL 디렉토리 (가변 교체 일부를 포함하여 핸들 템플릿)
• WWW/로케일 디렉토리 (현지화 파일)