组合 API 不适用于 Nuxt-TS答案

【问题标题】：composition api doesn't work with Nuxt-TS组合 API 不适用于 Nuxt-TS
【发布时间】：2020-04-27 20:03:47
【问题描述】：

使用npx create-nuxt-app 创建了 nuxt 应用程序。关注https://typescript.nuxtjs.org 的文档，但是我在使用@vue/composition-api 时遇到问题：

示例组件.vue：

<template>
  <div>
    {{ msg }}
  </div>
</template>

<script lang="ts">
import { createComponent, ref } from '@vue/composition-api'

export default createComponent({
  setup() {
    const msg = ref('hello')

    return {
      msg
    }
  }
})
</script>

不起作用，抛出错误“属性或方法“msg”未在实例上定义，但在渲染期间被引用。”因为它看不到我的ref。我在“plugins/composition-api.ts”中添加了组合 API 作为插件：

import Vue from 'vue'
import VueCompositionApi from '@vue/composition-api'

Vue.use(VueCompositionApi)

然后在nuxt.config.ts中：

plugins: ['@/plugins/composition-api']

【问题讨论】：

标签： javascript vue.js nuxt.js

【解决方案1】：

我的错，忘记了 nuxt 中的 TS-runtime：

npm i -S @nuxt/typescript-runtime

那你需要更新package.json：https://typescript.nuxtjs.org/guide/runtime.html#installation

【讨论】：