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>
5 Réponses :
Ah, d'une simplicité embarrassante, j'ai changé
importer i18n depuis './plugins/i18n'
à
importer {i18n} depuis './plugins/i18n'
et tout fonctionne maintenant.
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.
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');
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
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
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
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 }