@vitejs/plugin-vue reactivityTransform: Problems with $() being parsed in files where I want want it to

[zz541843]

Vue version

3.2.45

Link to minimal reproduction

vitejs/vite-plugin-vue#60

Steps to reproduce

vitejs/vite-plugin-vue#60

What is expected?

.

What is actually happening?

In short, either reactivityTransform: true or reactivityTransform: ["./src/* /"] will scan nodes_ For the files in modules. I have a custom package. After being packaged through vite, a $or $$function will appear, which will be detected by @ vitejs/plugin-vue

System Info

No response

Any additional comments?

No response

[LinusBorg]

From the reproduction provided in the other repo, I don't see how this is a bug. It's documented that ReactivityTransform will transform $() in any projects files. So if you activate this transform, don't use that function name for anything else. Specifically, likely: don't use JQuery.

You also say how it's a problem with a library you are creating with Reactivity Transform, and then also have the Reactivity Tranfsorm activated in the consuming project. Why? Just turn off the Transform in the consuming project, it should not be needed - unless you publish your library without bundling it first? That would not be recommended.

[LinusBorg]

Also as a sidenote: this is an still an experimental API, subject to change.

[LinusBorg]

And finally, If you want to argue for a plugin option to restrict the transform to specific folders: That would be a feature request for vite-plugin-vue, not us.

https://github.com/vitejs/vite-plugin-vue/blob/main/packages/plugin-vue/src/script.ts#L56

[zz541843]

From the reproduction provided in the other repo, I don't see how this is a bug. It's documented that ReactivityTransform will transform $() in any projects files. So if you activate this transform, don't use that function name for anything else. Specifically, likely: don't use JQuery.

You also say how it's a problem with a library you are creating with Reactivity Transform, and then also have the Reactivity Tranfsorm activated in the consuming project. Why? Just turn off the Transform in the consuming project, it should not be needed - unless you publish your library without bundling it first? That would not be recommended.

I opened reactivityTransform in the consumingproject, but I can't control whether there is a function name of $or $$in the third-party library. Except for the one I wrote myself, I used vite to package it after I wrote it. After code confusion, the function name of $or $$will appear, which is not included in the original code

There are two key issues. The official document says that node will not be scanned_ $or $$in the modules directory, but this is not the case, and how to make the packaged code of vite not appear the function name of $or $$

[LinusBorg]

1. If you bundle your library with vite, all reactivity transform globals are removed. there's not $() anymore
2. If you bundle your library with vite, the consuming project does not have to activate Reactivity Transform
3. If you find that vite-plugin-vue claims to skip node_modules for reactivity Transform, but doesn't, that's a bug in that plugin, not in Vue core. So you should continue that conversation in SyntaxError: Identifier '$' has already been declared vitejs/vite-plugin-vue#60