vue 反应性转换 $ref 未定义答案

【问题标题】：vue reactivity transform $ref not definedvue 反应性转换 $ref 未定义
【发布时间】：2022-07-27 16:26:32
【问题描述】：

根据文档中的this页面，宏应该是

全局可用，Reactivity时不需要导入转换已启用

我已经根据docs here：在我的 vue 配置中明确选择了反应性转换：

// vue.config.js
    config.module.rule('vue')
      .use('vue-loader')
      .tap((options) => {
        return {
          ...options,
          reactivityTransform: true
        }
      })

但我从 eslint 获得了 '$ref' is not defined。我想我需要在某处启用它，以便 eslint 理解它是一个全局宏，但我在文档中找不到任何关于它的信息。

我错过了什么？

【问题讨论】：

标签： vue.js

【解决方案1】：

我设法通过将其添加到 .eslintrc,js 来解决这个问题

globals: {
  $ref: 'readonly',
  $computed: 'readonly',
  $shallowRef: 'readonly',
  $customRef: 'readonly',
  $toRef: 'readonly'
}

...这个给global.d.ts

/// <reference types="vue/macros-global" />

【讨论】：

【解决方案2】：

如果您还没有使用.eslintrc 并且不想创建一个，另一种解决方案是添加

"types": [...  "vue/ref-macros"]

在tsconfig.json -> compilerOptions.

另一种解决方案是将/// <reference types="vue/macros-global" /> 添加到您的src/env.d.ts 文件的顶部。

【讨论】：