Vue packages version mismatch on Nuxt.js - vue.js

I'm trying to upgrade from Vue 2 version to vue 3, my project has Nuxt.js framework.
I put this command to upgrade : vue add vue-next, and upgrade has been successful. but when I try to execute project appear the next error :
Vue packages version mismatch:
- vue#3.0.7
- vue-server-renderer#2.6.12
This may cause things to work incorrectly. Make sure to use the same version for both.
I don't know how to resolve this problem.

That problem happened to me after an update. This is what worked for me.
delete the project's node_modules folder
delete the package-lock.json file
npm i
Solution found here https://github.com/nuxt/nuxt.js/issues/6823
see post from "daniplaninc"

The problem you are mentioning here comes from the fact that Nuxt 3 hasn't been released yet : it still doesn't support Vue 3, hence your application won't compile with vue 3...
The release is planned for Midsummer 2022 : https://v3.nuxtjs.org/community/roadmap/
I am waiting for this version too so I hope it will be released soon !

Related

Vue packages version mismatch issue to run vue based application

I am facing an issue to run a vue based application and the error message is as below when tried to run -
Vue packages version mismatch:
vue#2.6.10
vue-template-compiler#2.7.14
This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader#>=10.0, simply update vue-template-compiler.
If you are using vue-loader#<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.
npm install worked properly.
Am I missing anything?

facing error while stencil bundle command

currently i update my node and npm version for stencil bigcommerce when i make bundle for my old project i'm facing this type of problem. can anyone solve my this issue?
Error: No input specified: provide a file name or a source string to process
---------WARNING---------
We are currently in the process of deprecating node-sass fork https://github.com/bigcommerce-labs/node-sass
Your scss files were compiled using latest node-sass version https://github.com/sass/node-sass
This error might indicate that your scss file is not compatible with it.
There is still an option to compile scss file old fork by using --use-old-node-sass-fork.
But note, that this will lead to 500 error in production in near future.
---------WARNING---------
The best solution would be to resolve the SCSS errors in your files that are causing a failure.
However, a quick solution may be to roll back your stencil version. Try npm install -g #bigcommerce/stencil-cli#3.12 and then try bundling your theme. Note: you will need to be on Node v12 for this.
I solved this error, their were no node or big commerce CLI version issue, I had to just upgrade my bootstrap version in Base.html file and the error was solved.

Enabling IE 11 Angular 12.2 crashing with postcss package issue

I recently upgraded my project from Angular 11 to Angular 12.
Now, I am trying to enable IE 11. Did following:
Did the polyfills.ts file changes
pointed tsconfig.js to es5
removed not from IE 11 entry int .browserslistrc
Now I am not able to ng serve.
It crashes with following error:
Unknown error from PostCSS plugin. Your current PostCSS version is 8.3.6, but
postcss-preset-env uses 7.0.39. Perhaps this is the source of the error below.
I tried following to resolve this:
deleted node_modules, package-lock.json and did npm i several times - didn't work, same issue on ng serve
upgraded npm 6 to npm 7, added .npmrc with legacy-peer-deps=true - didn't work, same issue
used yarn to install the packages - didn't work same issue
added postcss, postcss-preset-env packages directly to depedencies - didn't work, same issue
added postcss, postcss-preset-env packages directly to devDepedencies - didn't work, same issue
I am using node 14.
Only thing that works is if I put the not back in front of IE in .browserslistrc, which was the whole point of doing this exercise.
Does anyone have any clue on how I might solve this?

Vercel Deployment: Internal Server Error when updating NPM Packages

I'm currently working on a NUXT 2.x App and I'm hosting the dev Project on Vercel. Now since the NPM packages are outdated and I want to remove some of the packages, the Deployed Version on Vercel throws an empty page with 500 error. If i stash the changes in package.json, everything works fine on the deployed version.
How can I update / remove NPM packages from my current Version and deploy it on Vercel?
Apparently, I had to downgrade the Firebase Version from 9.5 to 9.1, then it deployed just fine on Vercel.
I do recommend the usage of yarn upgrade-interactive --latest to get a list of all the package and the possible updates.
If you want to remove a specific one, go for yarn remove my-not-so-cool-package.
Think about bumping your Node.js version to 14 and try to build locally before pushing to Vercel.
Then, it comes down to reading out the differences that you may have between the versions of the packages and fix the breaking changes if any.
Can't help more without more info from your part.

During "NPM I" facing error: no matching constructor for initialization of 'v8::String::Utf8Value'

I am trying to run npm i, but it gives me the error:
error: no matching constructor for initialization of 'v8::String::Utf8Value'
I got the same problem today when I picked up a project that was working 5 months ago.
The whole game is to keep your dependencies updated in package.json.
The problem happens when there is some version mismatch in your components because something has updated behind the scenes. I suggest you go one by one and start installing latest stable versions of all dependencies. I've just been able to solve the problem with my angular project.
Every time you install a latest version of the dependency, it tells you what else it needs and you go install that. You'll realise that you don't have to install everything and half of it gets updated automatically.
To solve this issue, I just updated the npm version I was using to v10.16.0, then launched the npm install command afterwards; and the error was no more.