TypeError: Cannot redefine property: $i18n

[HadiChen]

vue & vue-i18n version

ex: 2.5.17, 8.0.0
vue:2.5.17
vue-i18n:8.0.0
nuxt.js:1.4.2

Reproduction Link

Steps to reproduce

What is Expected?

What is actually happening?

vue-i18n/src/extend.js

Line 5 in 170f691

Object.defineProperty(Vue.prototype, '$i18n', {

  Object.defineProperty(Vue.prototype, '$i18n', {
    get () { return this._i18n }
  })

fix bug edit

if (!Vue.prototype.hasOwnProperty('$i18n')) {
  Object.defineProperty(Vue.prototype, '$i18n', {
    get () { return this._i18n }
  })
}

[BorjaRafols]

I can confirm that this fixes the problem, any idea on when it will get merged into master?

[jgribonvald]

Me too I confirm this solve the problem !

[kazupon]

@jgribonvald
Hi!
sorry for my late response.

There is a possibility that this problem is caused by the vue-i18n build setting problem.

1a1958a

Would you be able to try to use the dist files (dist/*.js) that build with build confg of dev branch please?
https://kazupon.github.io/vue-i18n/installation.html#dev-build

[jgribonvald]

@kazupon
Hi and thanks to respond !
Else I'm sorry this doesn't change anything:

TypeError: can't redefine non-configurable property "$i18n"
ObjectOrReflectDefineProperty ...
defineProperty ...
extend ...
install ...
$n.use https://unpkg.com/vue@2.5.17/dist/vue.min.js:6:34186
__webpack_require__ ...
<anonyme> ...
<anonyme> ...
InnerModuleEvaluation  ...
ModuleEvaluate ...

I've updated the fiddle : https://jsfiddle.net/jgribonvald/cmyk6Lua/

[kazupon]

@jgribonvald
Thank you for your chekcing! 🙇
I've updateed dev branch.
6d5ec61

Could you try the checking now please? 🙏

[jgribonvald]

@kazupon sorry for the delay
Nothing better, here is the trace of the error:

Uncaught TypeError: Cannot redefine property: $i18n
    at Function.defineProperty (<anonymous>)
    at extend (...)
    at Function.install (...)
    at Function.$n.use (VM169 vue.min.js:6)
    at Module.5a74

[kazupon]

@jaredzhu1993
Hi!

I found the strange javascript codes in your jsfiddle reproduction.
In javascript of jsfiddle, VueI18n had been doubly bundled. 🤔

Could you provide the minimum reproduction codes with repository please? 🙏

[jgribonvald]

In my mind the problem is that we have 2 web components (that are 2 repositories) including their dependency of vue-i18n, and so as it's builded and loaded separately they try to load twice vue-i18n whereas there is only on vuejs instance.
I'm not really competent in this part, but that i can say is that the fix

if (!Vue.prototype.hasOwnProperty('$i18n')) {
  Object.defineProperty(Vue.prototype, '$i18n', {
    get () { return this._i18n }
  })
}

is working ! It means that it check that vue-i18n isn't already registered into vuejs.

On an other side why not having an independant plugin ? used as a service...

here a new jsfiddle : https://jsfiddle.net/jgribonvald/j4zq58dy/ and look at console
sources are here: https://github.com/uPortal-contrib/uPortal-web-components

[kazupon]

I have released v8.1.1
please try it.

[jgribonvald]

this doesn't not solve the problem
vue-i18n should manage several web-components (and not related/on same project ) trying each one to configure $i18n attribute on their own : TypeError: can't redefine non-configurable property "$i18n"
After it was setted all components trying to do the same configuration will get the error

[jgribonvald]

@kazupon : thanks a lot !