Angular Browserslist: caniuse-lite n'est plus à jour. Veuillez exécuter la commande suivante `npm update`

J'ai récemment commencé à obtenir cette erreur sur un projet Angular 8 (nœud v10.16.0) sur lequel je travaille. L'exécution de la mise à jour npm de la liste des navigateurs caniuse-lite n'a rien fait

J'ai donc supprimé package-lock.json, supprimé node_modules et exécuté l'installation de npm, mais le fichier de la liste des navigateurs a disparu. Encore une fois, lorsque j'exécute ng build, je reçois le même message: Browserslist: caniuse-lite est obsolète. Veuillez exécuter la commande suivantenpm update

Je vois cet article sur le même sujet: Browserslist: caniuse-lite est obsolète. Veuillez exécuter la commande suivante `npm update caniuse-lite Browserslist` Cependant, il parle de WebCompiler et d'autoprefixer et je n'en ai aucune idée. Veuillez guider

Résolution d'un problème obsolète de caniuse-lite en exécutant les commandes ci-dessous.

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

TLDR: (peut sembler contre-intuitif sans l'explication)

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

Explication:

Ce message d'avertissement ("canisuse-lite est obsolète, s'il vous plaît ....") est généré par les scripts dans la liste des navigateurs lors de la construction / démarrage s'il trouve que la version installée de caniuse-lite est antérieure à 2 versions de la version actuelle. Si rien dans votre projet n'a changé et que vous voyez soudain ce message lors du démarrage ou de la construction de votre projet, cela signifie probablement qu'il y a eu une mise à jour récente de la version de caniuse-lite.

Malheureusement, le message texte que la liste des navigateurs affiche n'est utile que si vous avez installé caniuse-lite en tant que dépendance de votre projet. Probablement pas. Ainsi, lorsque vous exécutez la suggestion de «mise à jour npm caniuse-lite» ou «mise à jour npm» caniuse-lite @ latest »(ou« installation npm »), npm ne voit pas ce package répertorié dans vos dépendances package.json, il ignore donc la demande.

Comment ces packages sont-ils devenus des dépendances à l'époque? Lorsque votre projet a été créé (peut-être avec une application angularapp ou create-react-app ou similaire pour votre framework), npm a installé les navigateurs listés comme une dépendance de ses outils nécessaires, pas comme l'une des dépendances de votre projet. Dans le même temps, caniuse-lite a été installé en tant que dépendance de Browserslist. Plus tard, lorsque le projet a été mis à jour, un fichier package-lock.json a été créé qui verrouille toutes les dépendances sur une version spécifique.

Si vous pouviez mettre à jour les informations de version dans la liste des dépendances dans package-lock.json, l'exécution de 'npm install' mettrait à jour ces packages dans node_modules. Vous ne devez pas modifier package-lock.json manuellement. Au lieu de cela, la meilleure façon de le faire est:

1. Faites temporairement de ces packages une dépendance de votre projet:

   npm install caniuse-lite Browserslist

   En plus de mettre à jour le package vers la dernière version, cela met à jour la liste des dépendances dans package.json et (surtout) package-lock.json.

2. Supprimez ces packages en tant que dépendances directes de votre projet:

   npm désinstaller la liste de navigateurs de caniuse-lite

   Étant donné que ces packages sont utilisés par d'autres dépendances, ils ne sont pas supprimés de node_modules. Seul package.json est mis à jour pour les supprimer en tant que dépendance de projet.

3. Validez package-lock.json. N'importe qui d'autre peut maintenant simplement exécuter 'npm install' pour obtenir les deux packages mis à jour à partir de la liste des sous-dépendances dans package-lock.json et arrêter le message d'avertissement.