如何将 Vue 插件包含到 Vue TypeScript 的模板中？

Posted 2023-02-23

【中文标题】如何将 Vue 插件包含到 Vue TypeScript 的模板中？

【英文标题】：How to include Vue plugins to Vue TypeScript's template?

【发布时间】：2018-03-09 21:24:45

【问题描述】：

如何在 Vue TypeScript 的模板中包含 Vue 插件，例如 vue-webpack-typescript？

例如，vue-meta。

我已经添加到./src/main.ts这个：

import * as Meta from 'vue-meta';

Vue.use(Meta, 
  keyName: 'head', 
  attribute: 'data-vue-meta', 
  s-s-rAttribute: 'data-vue-meta-s-s-r', 
  tagIDKeyName: 'vmid'
);

并将其添加到./src/components/home/home.ts 组件：

export class HomeComponent extends Vue 

  static head() 
    return 
      title: 'Test'
    
  

但这不起作用，不要显示超过书面标题..

【参考方案1】：

我想这与包含 Vue 插件无关。 如果您正确设置 typescript 编译器以使用 vue，则该组件将使用任何插件。所以我想这将是您使用类样式组件的问题。

根据 Vue 的官方示例，您需要 vue-class-component 才能使 Vue 识别类组件。 https://vuejs.org/v2/guide/typescript.html#Class-Style-Vue-Components

@Component
export class MyMixin extends Vue 
  mixinValue = 'Hello'

祝你好运！

【参考方案2】：

也许你应该在组件装饰器中这样写：

@Component(
  head () 
    return 
      title: 'test'
    
  
)
export class Test extends Vue