node_modules does not provide an export named 'Ref' on Vue.js component-CodePudding

I'm having a weird error. On a component I have, Ref is working correctly. On a component I've just created, id doesn't. I'm calling it the same way on both.

import { Ref } from 'vue';

const isOpen = ref(false);

Giving the error:

Uncaught (in promise) SyntaxError: The requested module '/node_modules/.vite/deps/vue.js?v=f65e1616' does not provide an export named 'Ref'

I've tried running "npm run build" again, with the following error:

Non-existent export 'Ref' is imported from node_modules/vue/dist/vue.runtime.esm-bundler.js

I don't really know what could be causing this. I work on this project on 2 different computers and I've cloned it a few days ago. I haven't encountered any issues until now

CodePudding user response：

You have to change your import

Try this

import { ref } from 'vue';

You can see the documentation of Vue.js (template refs)

CodePudding user response：

For anyone having this issue in the future, for some reason when writing "import ref" your code editor may wrongly autocomplete it with capitalized { Ref } instead of the right { ref }