diff --git a/src/guide/migration/global-api.md b/src/guide/migration/global-api.md index b2727957bc..f0be8f9d9a 100644 --- a/src/guide/migration/global-api.md +++ b/src/guide/migration/global-api.md @@ -76,6 +76,7 @@ An app instance exposes a subset of the current global APIs. The rule of thumb i | Vue.directive | app.directive | | Vue.mixin | app.mixin | | Vue.use | app.use ([see below](#a-note-for-plugin-authors)) | +| Vue.prototype | app.config.globalProperties ([see below](#vue-prototype-replaced-by-config-globalproperties)) | | All other global APIs that do not globally mutate behavior are now named exports, as documented in [Global API Treeshaking](./global-api-treeshaking.html). @@ -106,6 +107,25 @@ In 3.0, the check of whether an element is a component or not has been moved to - This will be a new top-level option in the Vue CLI config. ::: +### `Vue.prototype` Replaced by `config.globalProperties` + +In Vue 2, `Vue.prototype` was commonly used to add properties that would be accessible in all components. + +The equivalent in Vue 3 is [`config.globalProperties`](/api/application-config.html#globalproperties). These properties will be copied across as part of instantiating a component within the application: + +```js +// before - Vue 2 +Vue.prototype.$http = () => {} +``` + +```js +// after - Vue 3 +const app = Vue.createApp({}) +app.config.globalProperties.$http = () => {} +``` + +Using `provide` (discussed [below](#provide-inject)) should also be considered as an alternative to `globalProperties`. + ### A Note for Plugin Authors It is a common practice for plugin authors to install the plugins automatically in their UMD builds using `Vue.use`. For instance, this is how the official `vue-router` plugin installs itself in a browser environment: @@ -178,6 +198,8 @@ export default { } ``` +Using `provide` is especially useful when writing a plugin, as an alternative to `globalProperties`. + ## Share Configurations Among Apps One way to share configurations e.g. components or directives among apps is to create a factory function, like this: