2.5.13
https://jsfiddle.net/b5a1zh6u/31/
just open this simple use case: https://jsfiddle.net/b5a1zh6u/31/
you will see an error in console.
As written in this issue, Vue.extend()
does not work as expected.
The code should create a new global Vue instance and installa a plugin that is used by the component template.
console error due to $t method not found.
I wrote the reproduction fiddle starting from Evan's one
if I set the $t function directly or as a plugin, on the global Vue like this, it works:
Vue.prototype.$t = val => `* ${val}`
Just to bring more precision, the plugin seems to install the method $t only on the root component. Any child component cannot access the method $t.
Example: https://jsfiddle.net/j34b5g30/41/
This differ if we use the plugin directly on the global instance before extending vue.
Example: https://jsfiddle.net/r2stwc4h/2/
It was my mistake assuming this would work in the previous comments. To make it fully operate as a base constructor, an additional internal flag needs to be set to true. This cannot be made the default for Vue.extend, so it will likely be exposed via a public API in 2.6.
In 3.0 we are going to rethink how the global API works to avoid some of the problems caused by the global APIs mutating the root Vue object. For testing purposes, libraries like vue-test-utils has provided workarounds like createLocalVue. For now we are not going to introduce another API that is likely to be obsolete in 3.0.
Just to confirm, is there a way around this in Vue 2? Or is a solution only available in 3?
Most helpful comment
It was my mistake assuming this would work in the previous comments. To make it fully operate as a base constructor, an additional internal flag needs to be set to
true. This cannot be made the default forVue.extend, so it will likely be exposed via a public API in 2.6.