9
votes

Vue-i18n 'Impossible de lire la propriété' _t 'd'undefined à Proxy.Vue. $ T'

J'ai des problèmes lors de l'intégration de vue-i18n dans mon application. J'ai utilisé cette page comme source d'inspiration. XXX

Donne l'erreur: Impossible de lire la propriété '_t' d'undefined à Proxy.Vue. $ t Le suivi de l'erreur dans Chrome devtools m'amène à la ligne 149 (l'instruction return) de vue-i18n.esm.js:

"dependencies": {
  "axios": "^0.18.0",
  "bootstrap-vue": "^2.0.0-rc.11",
  "npm": "^6.5.0",
  "ol": "^5.3.0",
  "proj4": "^2.5.0",
  "qs": "^6.6.0",
  "vue": "^2.5.17",
  "vue-i18n": "^8.8.1",
  "vue-router": "^3.0.2",
  "vue-spinners": "^1.0.2"
},

J'utilise vue-cli-3 webpack config et installé vue-i18n à partir de npm et en utilisant comme plugin.

i18n.js (dans le répertoire src / plugins):

import Vue from 'vue/dist/vue.js'
import VueRouter from 'vue-router'
import BootstrapVue from 'bootstrap-vue'
import VueSpinners from 'vue-spinners'

import i18n from './plugins/i18n'
...
new Vue({
  router,
  i18n,
  data() {
    return store;
  },
  render: h => h(App)
}).$mount('#app')

main.js :

import Vue from 'vue/dist/vue.js';
import VueI18n from 'vue-i18n';

Vue.use(VueI18n);

const messages = {
  'en': {
    username: 'Username',
    ...
  },
  'se': {
    username: 'Användarnamn',
    ...
  }
};

export let i18n = new VueI18n({
  locale: 'en', // set locale
  fallbackLocale: 'se', // set fallback locale
  messages, // set locale messages
});

Dépendances de package.json:

Vue.prototype.$t = function (key) {
  var values = [], len = arguments.length - 1;
  while ( len-- > 0 ) values[ len ] = arguments[ len + 1 ];

  var i18n = this.$i18n;
  return i18n._t.apply(i18n, [ key, i18n.locale, i18n._getMessages(), this ].concat( values ))
};

Que dois-je faire?

p>


0 commentaires

5 Réponses :


11
votes

Ah, d'une simplicité embarrassante, j'ai changé

importer i18n depuis './plugins/i18n'

à

importer {i18n} depuis './plugins/i18n'

et tout fonctionne maintenant.


1 commentaires

Veuillez consulter Puis-je répondre à ma propre question? et revenir deux jours plus tard et vérifier si vous avez d'autres réponses que 15 réputation.



2
votes

Si quelqu'un est venu ici avec le même problème, mais utilise export default , j'ai eu ceci dans mon main.js:

import i18n from './translations';

new Vue({
    i18n,
    ...
}).$mount('#app');

Où traductions / index. js a chargé le plugin et tout comme d'habitude. Apparemment, vous devez nommer l'importation «i18n» pour que cela fonctionne correctement:

import translations from './translations';

new Vue({
    translations,
    ...
}).$mount('#app');


1 commentaires

Vous pouvez nommer l'importation comme vous le souhaitez, mais vous ne pouvez utiliser la notation ES6 pour l'attribuer à une propriété d'objet que si vous la nommez i18n



0
votes

src / i18n / index.js

import i18n from '@/i18n'

new Vue({
  i18n,
  router,
  render: h => h(App)
}).$mount('#app')

main.js

import Vue from 'vue'
import VueI18n from 'vue-i18n'

Vue.use(VueI18n)


// 注册i18n实例并引入语言文件
const i18n = new VueI18n({
  locale: 'zh_cn',
  messages: {
    'zh_cn': require('@/assets/languages/zh_cn.json'),
    'en_us': require('@/assets/languages/en_us.json'),
    'es_ve': require('@/assets/languages/es-ve.json')
  }
})

export default i18n

0 commentaires

0
votes

Vue.prototype._i18n = i18n doit être sous la ligne App.mpType = 'app'

App.mpType = 'app'
Vue.prototype._i18n = i18n

https: // github .com / kazupon / vue-i18n / issues / 276 # issuecomment-663071363


0 commentaires

0
votes

J'ai également signalé cette erreur, mais je ne l'ai pas résolue en utilisant la méthode ci-dessus. En fin de compte, j'ai trouvé qu'il ne fallait pas introduire de modal. Supprimez le code suivant pour résoudre:

import Modal from XXX

export default {
  components: {
    Modal
}


0 commentaires