Does Nuxt Bridge migration upgrade to Vue 3 as well? - vue.js

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?

Related

vue dev tools not working with vue-cli project

I've installed new vue-cli project and when launched locally and opened on localhost:8080 by running
npm run serve
Vue dev tools stayed inactive. I've read that one needs to initialize Vue instance, in order for it to work, but with vue-cli, app is initialized with createApp, but not with Vue instance.
I recently had this problem using vue cli 4.5.3. After an upgrade to 4.5.4 using vue upgrade the devtools fired up.
It was my bad. I've accidentally used vue v3 instead of v2. After switching back to 2 version, works fine.

How to install vue3 beta using vue/cli?

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);

router.js file NOT created when installing vue-router

I am following this guide:
https://github.com/bradtraversy/vue_crash_todolist
https://youtu.be/Wy9q22isx3U
At the end its shown how to install the vue-router through vue ui. I have done that as well:
but for some reason I don't get a router.js file as the author describes in the video.
Is something wrong with my installation or has the creating of a router.js file been removed in later versions of vue??
I am on:
Now using node v10.0.0 (npm v5.6.0)
#vue/cli-service-global#4.2.2
#vue/cli 4.2.2
It should definitely be there after installation through the vue ui
Try updating to the latest version of node
As u123 mentioned, in the most recent version of vue cli, the router is added to src/router/index.js

Should my Vue plugin that i'm about to publish depend on Vue itself?

I wrote a Vue (2) plugin and am about to publish it to NPM. The question is should the plugin's package.json contain
"dependencies": {
"vue": "^2.5.21"
}
I'm pretty sure it should because it's clear that the plugin won't work without Vue itself. But at the same time i'm doubting: who would even try to use Vue plugin without Vue already installed as a project's dependency? And if I don't add it to the dependencies list then how would I be able to specify which versions of Vue the plugin does work with? (For example, if a user uses Vue 2.1.3 and my plugin will only work with versions starting from 2.5.17)

How to check a projects vue.js version?

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