Uncaught TypeError: r.Vue2.use is not a function

[darthf1]

Hi!

With "@pinia/nuxt": "0.0.9", I get an error on the production environment. development works fine. When I downgrade to "@pinia/nuxt": "0.0.7",, the production environment works again.

Sorry for the another strange error. Also perhaps the core issue is not related to pinia, but I can't tell.

---

In the console, the following error is displayed:

Uncaught TypeError: r.Vue2.use is not a function

Looks like its coming from these lines in the plugin.

[posva]

Same as before, I need a boiled down repro to check.

[maxdzin]

The same for me. Production is failed with both, "@pinia/nuxt": "0.0.9" and "@pinia/nuxt": "0.1.0".
For now only downgrade helps.

[posva]

This is not enough info for me to check. The plugin runs in Nuxt 2, Nuxt Bridge and Nuxt 3. A boiled down repro will really help

[maxdzin]

Hi @posva
I've created a minimal repo for you to check.
https://github.com/spirico/nuxt-pinia-test
I've tried today to create a new fresh new Nuxt.js project and added pinia dependencies to that. And new errors come:

Please, note I've tried both options - to move @pinia/nuxt to the dependencies and then to devDependencies, neither works.
So, can you please point me out what is wrong with that and what should I do to solve those issues?

[maxdzin]

For convenience, I've created a new issue to track here:
#748

[nash403]

Hi @posva ! 👋

I am having the same "Uncaught TypeError: r.Vue2.use is not a function" error.

here is a repo for reproduction.

After install, if I run npm run dev everything works fine, but with npm run build && npm start I get this error in the console and the app interactivity is broken.

[nash403]

@Spirico I just had the same error with @pinia/nuxt and it was just that @nuxt/kit couldn't be installed properly because I was on node 16.9.x and it requires node ^16.11.x.

Your version v14.18.1 seems okay though.... maybe look better in the logs of npm install (that's how I noticed the warning about the version) or remove your lockfiles and try reinstalling

[maxdzin]

Thanks
I've already tried that steps - to reinstall and to remove package-lock as well. But still I got the same issue.

Did you find any solution for that?

[maxdzin]

Greetings guys!

Since I have an issue with @nuxt/kit - the npm install @nuxt/kit resolved that error and in development mode is working now.

But the issue of "r.Vue.use" still persists on the build.
I've also tried to deploy on Digitalocean and the "Uncaught TypeError: gt.Vue2.use is not a function" is there as well.

The Nuxt.js + pinia app is available to check in this repo: https://github.com/spirico/pinia-nuxt

I've tried to resolve it but still no luck. So, I would be glad if someone can point me how to overcome it.
Thanks!

[maxdzin]

P.S. As for versions, currently used:
node v14.18.1
npm v8.1.1

pinia v2.0.0
@pinia/nuxt v0.1.0

You can see detailed info about the versions in this repo:
https://github.com/spirico/pinia-nuxt

Downgrading to @pinia/nuxt to v 0.0.7 is caused new error:

[maxdzin]

Hi guys!
I've figured out that the issue with @nuxt/kit for development mode can be omitted by installing and using node v16.13.0 and npm v8.1.0 and it is not required to install @nuxt/kit additionally.

The bug Uncaught TypeError: r.Vue2.use is not a function in production is still persists.

[maxdzin]

Greetings everyone!
@darthf1, @nash403, guys I wonder if you already managed to get around the error: r.Vue2.use is not a function?
Unfortunately, downgrading didn't work for me - I've tried with different versions, and deployment on the Digitalocean app platform has the same. So, I'm still looking for any solution.
Thanks!

[darthf1]

No I havent. I stayed on "@pinia/nuxt": "0.0.7" for now until I can debug further.

[maxdzin]

@darthf1 OK. Thanks.

[nash403]

@Spirico I haven't too. I still have the Uncaught TypeError: r.Vue2.use is not a function error with nuxt build unfortunately..

[maxdzin]

@nash403 ok. Thanks for the response.

[nash403]

Hi again @Spirico, I managed to make the build work for Vue 2.x by rewriting the @pinia/nuxt as a custom module in my repo and getting rid of the vue-demi specifics (see working app on this branch).

Somehow the exported Vue2 object from vue-demi is not working as expected.

Hi @posva, can you tell if you are able to reproduce the Uncaught TypeError: r.Vue2.use is not a function issue with this boiled down repo nuxt-pinia-example ? (steps: clone -> npm install -> npm run build -> open the app and you can see error in the console)

[darthf1]

Since you mentioned vue-demi, this is another issue I get. It looks related to pinia, but it isnt because it happens when i update other deps where pinia isnt touched at all.

ERROR in ./node_modules/vue-demi/lib/index.mjs
Module not found: Error: Can't resolve '@vue/composition-api/dist/vue-composition-api.mjs' in '/home/node/app/node_modules/vue-demi/lib'
 @ ./node_modules/vue-demi/lib/index.mjs 2:0-81 7:12-29 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691
 @ ./node_modules/@pinia/nuxt/templates/plugin.js
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi ./node_modules/@nuxt/components/lib/installComponents.js ./.nuxt/composition-api/register.js ./.nuxt/client.js

[darthf1]

Since you mentioned vue-demi, this is another issue I get. It looks related to pinia, but it isnt because it happens when i update other deps where pinia isnt touched at all.

ERROR in ./node_modules/vue-demi/lib/index.mjs
Module not found: Error: Can't resolve '@vue/composition-api/dist/vue-composition-api.mjs' in '/home/node/app/node_modules/vue-demi/lib'
 @ ./node_modules/vue-demi/lib/index.mjs 2:0-81 7:12-29 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691 18:0-691
 @ ./node_modules/@pinia/nuxt/templates/plugin.js
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi ./node_modules/@nuxt/components/lib/installComponents.js ./.nuxt/composition-api/register.js ./.nuxt/client.js

Related: vueuse/vue-demi#106
Resolved:

const config: NuxtConfig = {
    extend(config) {
      config.resolve!.alias!['@vue/composition-api'] =
        '@vue/composition-api/dist/vue-composition-api.mjs'
      config.resolve!.alias![
        '@vue/composition-api/dist/vue-composition-api.esm.js'
      ] = '@vue/composition-api/dist/vue-composition-api.mjs'
    },
}

[maxdzin]

Hi @nash403
Thank you! That workaround helped me as well.

@darthf1 the vue-composition-api aliases resolving was helped partially since nuxtServerInit is not triggered in this case anymore for some reason (I have not yet time to debug that).

[Rigo-m]

Why is the issue still closed when there are several reproduction repos?