@vueuse/nuxt - Nuxt 3 Installation Issue?
See original GitHub issueFollowing the installation advise here: https://vueuse.org/guide/#nuxt
Is there anything else we need to do to get this working within a Typescript setup?
I have a very minimal Nuxt 3 starter, with just Windi.css and @vueuse/nuxt as the build modules - and I see this error:
Without calling useMouse():
Example of code:
<template>
<Navigation/>
<main ref="main" class="text-blue-800 min-h-screen">
<slot />
</main>
<BrandsWeLove />
<Footer/>
</template>
<script lang="ts">
export default defineComponent({
setup () {
const main = ref()
const { x, y } = useMouse()
return {
main
}
}
})
</script>
Any suggestions as to why the auto-import isn’t working?
Output of running npx nuxi info
:
Nuxt CLI v3.0.0-27338323.1e98259 21:21:54
RootDir: /Users/michael/kindandconscioius/kindandconscious-shopify 21:21:55
Nuxt project info: 21:21:55
------------------------------
- Operating System: `Darwin`
- Node Version: `v16.13.0`
- Nuxt Version: `3.0.0-27338323.1e98259`
- Package Manager: `npm@8.1.0`
- Bundler: `Vite`
- User Config: `buildModules`, `components`, `css`
- Runtime Modules: `-`
- Build Modules: `nuxt-windicss@2.2.1`, `@vueuse/nuxt@7.4.1`
------------------------------
Issue Analytics
- State:
- Created 2 years ago
- Comments:20 (14 by maintainers)
Top Results From Across the Web
Installing the nuxt3 version based on documentation fails ...
Same issue here. Can't install it with Nuxt 3. Node v18.1.0. NPM v8.10.0. npm ERR! ERESOLVE could not resolve npm ...
Read more >vueuse/nuxt
This is an add-on of VueUse, which provides better Nuxt integration auto-import capabilities. Install. npm i @vueuse/nuxt. // nuxt.config export ...
Read more >Get Started | VueUse
From v7.2.0, we shipped a Nuxt module to enable auto importing for Nuxt 3 and Nuxt ... nuxt.config.ts export default { modules: [...
Read more >How to use vue 3 with nuxt?
I'm using Nuxt3 for a project and when installing it with the cli in the docs it generated a vue 2.7 project. How...
Read more >Installation
Here, you will find information on setting up and running a Nuxt project in 4 steps.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@idanceinbetween Can confirm install via npm.
useMouse
is from@vueuse/core
.Using
yarn
(v1) andnpm 6
, the result is the below thus we could use it:Using
npm 8
, the result is:I’m not sure if this is an issue with npm 8, or how dependencies are defined within @vueuse as a project.
I guess the workaround for now is to use npm 6 or yarn if those are the package managers of choice.