NPM7: Incorrect detection of Vue version

Hi, I was trying to use @vueuse/core when I ran into an issue with this package. I’m using npm 7.0.3, node 15.0.1 and my package.json looks like this:

{
    "private": true,
    "scripts": {
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "production": "mix --production"
    },
    "devDependencies": {
        "@vue/compiler-sfc": "^3.0.2",
        "autoprefixer": "^10.0.1",
        "axios": "^0.19",
        "cross-env": "^7.0",
        "laravel-mix": "^6.0.0-beta.11",
        "lodash": "^4.17.19",
        "postcss-import": "^12.0.1",
        "postcss-nested": "^4.2.3",
        "postcss-simple-vars": "^5.0.2",
        "resolve-url-loader": "^3.1.0",
        "sass-resources-loader": "^2.1.1",
        "tailwindcss": "^1.9.6",
        "tailwindcss-filters": "^3.0.0",
        "vue": "^3.0.2",
        "vue-loader": "^16.0.0-beta.10",
        "vue-router": "^4.0.0-rc.1",
        "vuex": "^4.0.0-rc.1",
        "@vueuse/core": "^4.0.0-beta.38"
    }
}

I’m using Laravel Mix to compile all the assets (I’ll be using Laravel as a backend). Everything was going fine until I tried to use any function from the vueuse package.

The console error looked like this:

Going thru the module code I see some lines are overwritten depending of the Vue version and it looks like the module thinks I’m on version 2 of Vue. Manually changing those lines to the ‘v3’ fixed the issue. I’m not sure this is Laravel Mix fault (webpack wrapper) or not. Let me know how can I help fixing this issue.

[gerardnll]

Yes. Looks like it’s working on my main project (where I do the compiling). Great!

[antfu]

@gerardnll I see. I have heard that npm 7 will install the peerDepenencies automatically. I will have a look at this to see if we can come up with a solution. Thanks.