Lista de navegadores angulares: caniuse-lite está desactualizado. Ejecute el siguiente comando `npm update`

Recientemente comencé a recibir este error en un proyecto Angular 8 (nodo v10.16.0) en el que estoy trabajando. Ejecutar npm update caniuse-lite browserslist no hizo nada

Así que eliminé package-lock.json, eliminé node_modules y ejecuté npm install, pero el archivo de la lista del navegador desapareció. Nuevamente, cuando ejecuto ng build, recibo el mismo mensaje: Browserslist: caniuse-lite está desactualizado. Por favor ejecute el siguiente comandonpm update

Veo esta publicación sobre el mismo tema: Browserslist: caniuse-lite está desactualizado. Ejecute el siguiente comando `npm update caniuse-lite browserslist` Sin embargo, habla sobre WebCompiler y autoprefixer y no tengo ni idea de eso. Por favor guía

Se resolvió el problema obsoleto de caniuse-lite ejecutando los siguientes comandos.

npm cache clean  # optional
npm install caniuse-lite@latest --save

TLDR: (puede parecer contrario a la intuición sin la explicación)

  npm install caniuse-lite browserslist
  npm uninstall caniuse-lite browserslist

Explicación:

Este mensaje de advertencia ("canisuse-lite está desactualizado, por favor ...") se genera mediante scripts en la lista del navegador durante la compilación / inicio si encuentra que la versión instalada de caniuse-lite es anterior a 2 versiones de la versión actual. Si nada en su proyecto cambió y de repente ve este mensaje al iniciar o construir su proyecto, probablemente significa que hubo una actualización de versión reciente de caniuse-lite.

Desafortunadamente, el mensaje de texto que muestra la lista de navegadores solo es útil si instaló caniuse-lite como una dependencia de su proyecto. Lo más probable es que no lo hiciste. Entonces, cuando ejecuta la sugerencia 'npm update caniuse-lite' o 'npm update' caniuse-lite @ latest '(o' npm install '), npm no ve ese paquete en la lista de sus dependencias package.json, por lo que ignora la solicitud.

¿Cómo se convirtieron esos paquetes en dependencias entonces? Cuando se creó su proyecto (tal vez con la aplicación angularapp o create-react-app o similar para su marco), npm instaló la lista de navegadores como una dependencia de sus herramientas necesarias, no como una de las dependencias de su proyecto. Al mismo tiempo, caniuse-lite se instaló como una dependencia de la lista de navegadores. Más tarde, cuando se actualizó el proyecto, se creó un archivo package-lock.json que bloquea todas las dependencias a una versión específica.

Si pudo actualizar la información de la versión en la lista de dependencias en package-lock.json, la ejecución de 'npm install' actualizaría estos paquetes en node_modules. No debe editar package-lock.json manualmente. En cambio, la mejor manera de hacerlo es:

1. Transforme temporalmente estos paquetes en una dependencia de su proyecto:

   npm install lista de navegadores caniuse-lite

   Además de actualizar el paquete a la última versión, esto actualiza la lista de dependencias en package.json y (lo más importante) package-lock.json.

2. Elimine estos paquetes como dependencias directas de su proyecto:

   npm desinstalar la lista de navegadores caniuse-lite

   Como estos paquetes son utilizados por otras dependencias, no se eliminan de node_modules. Solo package.json se actualiza para eliminarlos como una dependencia del proyecto.

3. Confirmar package-lock.json. Cualquier otra persona ahora puede ejecutar 'npm install' para obtener los dos paquetes actualizados de la lista de subdependencias en package-lock.json, y detener el mensaje de advertencia.