Vue Templates Logo Vue Templates
Composition Api screenshot

Composition Api

Author Avatar Theme by Vuejs
Updated: 15 Aug 2023
4209 Stars

Composition API plugin for Vue 2

Github Live Preview

Overview:

The @vue/composition-api is a Vue 2 plugin that brings the Composition API to Vue applications. With the release of Vue 2.7, which includes the Composition API built-in, this plugin is now entering maintenance mode and will only support Vue 2.6 or earlier until it reaches End of Life by the end of 2022.

Features:

  • Installation via NPM: Easily install @vue/composition-api as a plugin with Vue.use() to leverage the Composition API.
  • CDN Support: Include @vue/composition-api after Vue for automatic installation, with exposure to the global variable window.VueCompositionAPI.
  • TypeScript Support: Requires TypeScript version >4.2 for proper type inference in Vue component options.
  • SSR Implementation: Implements the onServerPrefetch lifecycle hook for server-side rendering (SSR) in the absence of a definitive Vue 3 API.
  • Browser Compatibility: Supports all modern browsers and IE11+ with the option to install a WeakMap polyfill for lower IE versions.
  • Limitations: Provides workarounds for limitations like Template Refs and reactivity differences between Vue 2 and Vue 3.

Installation:

NPM:

npm install @vue/composition-api

CDN:

<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
<script src="https://cdn.jsdelivr.net/npm/@vue/composition-api"></script>

Summary:

The @vue/composition-api is a useful plugin for Vue 2 applications that allows developers to leverage the Composition API. With support for TypeScript and SSR implementation, this plugin ensures compatibility with modern browsers and provides workarounds for certain limitations in Vue 2.