Json capability

[ghost]

First and foremost, referencing an object literals list locally works as expected, Such as this:

var locales = {
    en: {
        menu: {
            about: "about",
            news: "news",
            contact: "contact"
        }
    },
    fr: {
        menu: {
            about: "à propos",
            news: "actualités",
            contact: "contacter"
        }
    }
}

Vue.use(VueI18n, {
    lang: 'fr',
    locales: locales
});

However, I have been struggling to reference a json file (instead of a local object literals list).

I attempted doing a XMLHttpRequest directly:

function loadJSON(callback) {
    var xobj = new XMLHttpRequest();
    xobj.overrideMimeType("application/json");
    xobj.open('GET', '../resources/i18n/locales.json', true);
    xobj.onreadystatechange = function() {
    if (xobj.readyState == 4 && xobj.status == "200") {
        callback(xobj.responseText);
    }
};
xobj.send(null);
}

var locales;

loadJSON(function(languageJSON) {
locales = JSON.parse(languageJSON);

Vue.use(VueI18n, {
lang: 'fr',
locales: locales
});

Have also tried doing an $.ajax request (as well as the equivalent with $.getJSON), like this:

$.ajax({
  url: "../resources/i18n/locales.json",
  dataType: "json",
  type: "GET",
  success: function (data) {
      Vue.use(VueI18n, {
          lang: 'fr',
          locales: data
      });
      console.log(data);
  }
});

My locales.json is as follows:

[{
  "en": {
    "menu": {
      "about": "about",
      "news": "news",
      "contact": "contact"
    }
  },

  "fr": {
    "menu": {
      "about": "à propos",
      "news": "actualités",
      "contact": "contacter"
    }
  }
}]

Both the above approaches output the following:

Array[1]
  0: Object
    en: Object
      menu: Object
        about: "about"
        contact: "contact"
        news: "news"
    fr: Object
      menu: Object
        about: "à propos"
        contact: "contacter"
        news: "actualités"

But other than that, I get several of these warnings (the expression is different in each of them): [Vue warn]: Error when evaluating expression $t("news.message2").

Regardless of the fact that I am most certainly doing something wrong (any hint appreciatted!), it would be much nicer if we could reference a (json) file path directly in the locales option.

Any chance that one such feature could be added to this plugin in the near future?

Thanks in advance!

[ghost]

Related question on stackoverflow

[kazupon]

related #6

I'll plan to support the dynamic locales loading in v3.0

[ghost]

Great, thanks!