Web development has come a long way from basic HTML and CSS websites. These days, we have web development libraries that allow for the quick development of dynamic websites that look amazing.
However, there are still a lot of challenges developers face daily. Random bugs and errors can appear at any time, whether from an added package or the framework itself. In this article, we’re talking about errors you might face when using the web-vitals library.
Also read: How to fix โObjects are not valid as a react childโ error?
Install web-vitals
One of the most obvious reasons why you’re seeing this error is because the web-vitals library isn’t installed. You can install the library by using the following command.
npm install --save-dev web-vitals
Alternatively, if you use Yarn use the following command.
yarn add web-vitals --dev
Now restart your development server and the error should be gone.
Reinitialise your project
If installing express didnโt do the trick, you might have to reinitialise your project to freshen up all the dependencies youโre using. This can be done by deleting the node_modules folder and the package-lock.json file. Just open a terminal, head over to your projectโs root folder and run the following commands one at a time.
rm -rf node_modules package-lock.json
npm install

If you get an error saying you donโt have appropriate permissions to carry out these tasks, prefix sudo to both the commands.
Manually add the package
If installing using the package manager isnโt working for you, you can manually install the express package. First, open your package.json file and add the following lines to the dependencies section.
{
// ....
"dependencies": {
"web-vitals": "^2.1.4"
// ....
},
}
Be sure to check and add the latest version of express in the line (4.18.0 at the time of writing). Once the line is added, open a terminal in the root folder of your project and run this command.
npm install
Also read: React vs Next.js: 3 talking points
