按照文档开启reactivityTransform功能报错

[teaim]

按照文档开启了reactivityTransform功能
https://vuejs.org/guide/extras/reactivity-transform.html#refs-vs-reactive-variables

代码里面

import { $ref } from 'vue/macros'

let count = $ref(0)

虽然$ref会全局自动导入, 但是我的ide无法识别$ref会报红, 为了消除这个异常, 我按照文档说明手动添加了下面这行
import { $ref } from 'vue/macros'
结果代码跑起来就报错

假如去掉手动导入$ref这个步骤, 代码是可以正常运行的
所以这里文档是不是描述错了

@yyx990803

[liulinboyi]

响应性语法糖目前是一个实验性功能，默认是禁用的，需要显式选择使用。在最终确定前仍可能发生变化，你可以查看 GitHub 上的提案与讨论来关注和跟进最新进展。

Vite

• 需要 @vitejs/plugin-vue@^2.0.0
• 应用于 SFC 和 js(x)/ts(x) 文件。在执行转换之前，会对文件进行快速的使用检查，因此不使用宏的文件应该不会有性能损失。
• 注意 refTransform 现在是一个插件的顶层选项，而不再是位于 script.refSugar 之中了，因为它不仅仅只对 SFC 起效。

// vite.config.js
export default {
  plugins: [
    vue({
      reactivityTransform: true
    })
  ]
}

......

其他请看文档 显式启用

[liulinboyi]

reactivityTransform: true这个我一开始就加了, 完全按照文档来的

目前的问题是在加了import { $ref } from 'vue/macros'这一行之后代码跑起来就跑错了

去掉之后$ref是可以正常运行使用的

请看这个仓库，克隆到本地运行试一下。

[teaim]

克隆之后可以正常运行, 但是加上那行import $ref再运行就报错了

我再次描述我的问题

Vue版本3.2.36, 项目是通过create-vue脚手架创建的, vite.config.js中已经开启了reactivityTransform

回到代码里面, 假如我不加 import { $ref } from 'vue/macros' 这一行代码是可以正常跑起来运行的

但是加了之后跑起来就会报错

至于我为什么要加这一行是为了让IDE识别到$ref, 而不是报红, 虽然不加那一行, 报红代码也能正常运行

[teaim]

https://github.com/teaim/reactivityTransform

[teaim]

发现解决方案了, 加了lang="ts"再运行就不会报错了
具体请看https://github.com/teaim/reactivityTransform/commit/febcdd58c89ee26c321aae8a838cf145d4a42744

[teaim]

js中暂时通过设置eslint的globals将报红给屏蔽了