I recently updated our app to use Nuxt Bridge following this guide:
https://v3.nuxtjs.org/bridge/overview
We were previously on Vue 2.7.10 but now when I check my vue version using npm view vue version I get 3.2.39.
But If I go into node_modules/vue/package.json I see this:
"name": "vue",
"version": "2.7.10",
I tried deleting node_modules, yarn.lock, .nuxt and explicitly added "vue":"3.2.39" to package.json then redid yarn install. After that I got an error about nuxt Cannot find module 'nuxt'.
So I guess my questions are: How can I tell which version of Vue I'm actually using in this project?
My goal is to upgrade to Vue 3, is there an issue with Nuxt Bridge and Vue 3?
When developing Nuxt.js
cannot find module '# vue / composition-api
I get an error. Why does this error occur?
Stop the project and
# if you use yarn
$ yarn add #vue/composition-api
# if you use npm
$ npm install #vue/composition-api --save
download composition-api in your project.
And start again.
I've found out this error is being caused by Vuter extension. This extension is requiring composition API which is available on Vue 3.x Disabling it fixes the problem but again you need Vuter yikes!
Vue composition API is a latest feature presented onwards in Vuejs 3.0. Please make sure your base dependency is set to correct vuejs version in package.json file.
P.S I am not sure of Nuxt compatibility.
Right now vue3 is in beta and I want to try it.
Is there a way using #vue/cli to install the vue3 beta? if so, How?
You need the latest version of #vue/cli and then run vue add vue-next in an existing Vue CLI project.
This will:
Add Vue 3 and the new Vue 3 Compiler to your project
Configure webpack to use the new vue compiler
Install Vuex 4 and vue-router 4 beta (or alpha dunno where they are rn) if the older versions are in your project
Codemods for compatibility
More Info here
However, not every package that works with Vue2 will work with this Vue3.
If all you want to try out is the new composition-api, there is a plugin which you can add which is still using Vue2 but with many of the composition-apis Features, probably all non-breaking changes? You install that by either running
npm install #vue/composition-api
or
yarn add #vue/composition-api
and then install it like this before using other APIs:
import Vue from 'vue';
import VueCompositionApi from '#vue/composition-api';
Vue.use(VueCompositionApi);
I am new to nuxt. I want to know whether is it possible to use Buefy on nuxt just by using CDN
as I directly imported beufy CDN in script in head function of nuxt.config
But it gave error while using navbar of beufy that the component is not registered correctly.
Nuxt supports buefy by default, when installing using npx create-nuxt-app you'll be asked if you want to use a component framework (buefy is an option here).
If you want to use it in an installed project you can npm install buefy --save and then add "nuxt-buefy" in the modules array of your nuxt.config
I use Ubuntu 16.04 and I'd like to know how I check the vue.js version used by my project.
How do I do that?
Let's summarize the solutions from #jonrsharpe, #JamesAMohler and #MartinCalvert for friends looking for a quick answer.
Run npm list vue (or npm list --depth=0 | grep vue to exclude packages' dependencies). It is a common way to check npm package's version in the terminal.
Of course, you can also check vuejs's version by browsing package.json (or use command like less package.json | grep vue).
Use Vue.version during the runtime. It is a global API provided in vue.js.
If you have the Vue.js Chrome dev tool extension installed and your application is built in development mode you can simply open up the Chrome Dev Tools and use the Vue extension tab. It is clearly displays the Vue version for the project at the top (see below)
Please simply try type npm v vue in terminal to check the version of Vue.js
This is what worked for me:
import Vue from 'vue'
alert(`Vue version : ${Vue.version}`);
If you want to check the current version of Vue installed in your machine use vue --version
If you want to check the Vue installed on the project then use npm list | grep vue#
There are few ways to check vue version:
npm v vue run this on the terminal
Check package.json, code will be something like this
"dependencies": {
"core-js": "^3.6.5",
"vue": "^2.6.11"
},
If you have vue dev tools installed then go to the Vue tab and you should be able to see the version there.
Note: If you use vue --version - this will check vue cli version, not Vue version
It can be checked from package.json file. Inside dependencies block you can see vue and its version.
"dependencies": {
"vue": "^2.6.11"
}
if you have installed vue dev tools extension like I recommend, you can just press ctrl + shift + i at least in the firefox and then look with vue extension picture
You can also just use npm v vue in command prompt, you cant use vue --version becausue this checks what Vue CLI you have
You can only use npm v vue in CLI/ in Terminal, you can't use vue --version, it shows error enter image description here
For the solution of in-app version showing for vue version 3+.
As #ray-foss mentioned: I am only able to use
import {version} from "vue";
console.log('Vue version', version);
The way using import Vue from 'vue' does not work anymore (for me).
You can also type to check the Vuejs version vue --version