【Nuxt】Nuxt2系にComposition APIを追加

Vue 3.0で追加されるComposition APIをNuxt 2系でも使えるようにする。

composition-api.nuxtjs.org


以下過去の記事。

コマンド

Nuxtのプロジェクトを作成後に次を実行

npm install @vue/composition-api

追加/変更

Vue.use

pluginsにファイルを追加し、ComposiitonApiをVue.use

//plugins/composition-api.ts
import Vue from "vue";
import VueCompositionApi from "@vue/composition-api";

Vue.use(VueCompositionApi);

config

先ほど作成したpluginをconfigに設定

//nuxt.config.js
plugins:[
    ...
    "@/plugins/composition-api"
]

import

実際に使用する場合はfromに@vue/composition-apiを指定

//*.vueや*.ts
import {...} from '@vue/composition-api'

参考