Browserslist: caniuse-lite está desactualizado. Ejecute el siguiente comando `npm update caniuse-lite browserslist`


88

Recientemente, cuando compilo mis archivos scss, aparece un error. El mensaje de error dice:

Browserslist: caniuse-lite está desactualizado. Ejecute el siguiente comandonpm update caniuse-lite browserslist

Primero, como dice el mensaje, corrí npm update caniuse-lite browserslistpero no solucionó el problema. Eliminé todo el directorio nod-modules y lo instalé nuevamente, también actualicé toda la carpeta npm updatepero ninguno de ellos resolvió el problema. También reinstalé autoprefixer y browserslist, pero ninguno de ellos resolvió el problema.

Si me quito

"options": {
      "autoPrefix": "> 1%"
    }

desde mi punto de vista compilerconfig.json, todo funciona bien, lo que significa que probablemente esté relacionado con el autoprefixer. Además, cambié manualmente la versión del paquete a la última versión package.jsony la reinstalé, pero no tuve suerte.

Respuestas:


42

Parece que está utilizando la extensión Web Compiler de Visual Studio. Hay un problema abierto para esto que se encuentra aquí: https://github.com/madskristensen/WebCompiler/issues/413

Hay una solución alternativa publicada en ese problema:

  1. Cerrar Visual Studio
  2. Dirígete a C:\Users\USERNAME\AppData\Local\Temp\WebCompilerX.X.X(X es la versión de WebCompiler)
  3. Elimine las siguientes carpetas de la node_modulescarpeta: caniuse-litey browserslist abra CMD (adentro C:\Users\USERNAME\AppData\Local\Temp\WebCompilerX.X.X) y ejecute:npm i caniuse-lite browserslist

1
Lo hice y ya no tengo ese error, pero tengo un nuevo error: Error de complemento: No se puede encontrar el módulo 'autoprefixer'. Traté de reinstalar y actualizar el autoprefixer pero todavía obtengo ese error.
Mehrdad Babaki

Suena como un tema diferente. Si tiene un enlace a su proyecto en línea o puede armar otro proyecto que tenga el problema, estaré encantado de verlo.
Scott Kuhl

Parece que cuando estaba tratando de solucionar el problema actualizando y reinstalando autoprefixer, había roto algo. Afortunadamente, hoy Web Compiler se actualizó y vi ese mensaje de error nuevamente. Seguí los pasos anteriores y esta vez el problema se solucionó.
Mehrdad Babaki

¿Alguna idea de dónde está este directorio en la Mac?
Safa Alai hace

34

Prueba esto resolvió mi problema npx browserslist@latest --update-db


1
Para el contexto: Mi IDE es VS Code, y mi proyecto JS solo incluía Parcel, react y react-dom cuando comencé a ver este error. Ninguna de las opciones anteriores funcionó. Esta solución arregló la mía.
Klay

En PhpStorm funcionó muy bien.
Neolot

trabajó para VueJS
JOG

Esto me ayudó mucho, gracias querido 5 estrellas
PacyL.js

31

Para desarrolladores angulares

Aunque, estoy respondiendo esto muy tarde. Tengo la mala costumbre de verificar los registros de cambios de todas las bibliotecas que uso 😀 y mientras revisaba las notas de la versión de Angular CLI, descubrí que lanzaron un nuevo parche ayer (9 de enero de 2020) que soluciona este problema.

https://github.com/angular/angular-cli/releases/tag/v8.3.22

Entonces, cuando se ejecute ng update, debe obtener actualizaciones para @angular/cli:

ingrese la descripción de la imagen aquí

Y correr ng update @angular/clisolucionará esta advertencia.

¡Salud!


19

Encontré un atajo en lugar de pasar vs code appData/webCompiler, lo agregué como una dependencia a mi proyecto con este cmd npm i caniuse-lite browserslist . Pero puede instalarlo globalmente para evitar agregarlo a cada proyecto.

Después de la instalación, puede eliminarlo de su proyecto package.jsony hacerlo npm i.

Actualizar:

En caso de que la solución anterior no lo solucione. Podría ejecutar npm update, ya que esto actualizaría los paquetes obsoletos / desactualizados.

Nota:

Después de ejecutar la actualización de npm, es posible que falten dependencias. Rastree el error e instale las dependencias que faltan. El mío era nodemon, que arreglo pornpm i nodemon -g


4
No tenía la carpeta / WebCompiler en mi carpeta / TEMP como sugirieron algunas otras publicaciones aquí, así que ejecuté esta línea de comando y parece haber solucionado el problema.
AppDreamer

13

Continuación de la respuesta anterior .

Tenía el mismo "error de complemento" que @MehrdadBabaki. Desinstalé el compilador web, eliminé la carpeta AppData WebCompiler mencionada anteriormente, luego volví a abrir VS2019 y reinstalé el compilador web.

ENTONCES fui a la carpeta WebCompiler de nuevo y lo hice npm i autoprefixer@latest npm i caniuse-lite@latestynpm i caniuse-lite browserslist@latest


solo actualice autoprefixer, caniuse-lite, la lista de navegadores es buena para mí
cwhsu

9

npm --depth 9999 updatesolucionó el problema para mí, aparentemente porque package-lock.jsoninsistía en las versiones desactualizadas.


11
Incluso npm --depth 99 update caniuse-lite browserslistcausado JavaScript heap out of memoryen mi proyecto, pero se npm --depth 20 update caniuse-lite browserslistejecuta rápido y solucionó el error en mi caso.
Alexandr Nil

5

En mi caso, he eliminado las caniuse-lite, browserslistcarpetas de node_modules.

Luego escribo el siguiente comando para instalar los paquetes.

npm i -g browserslist caniuse-lite --save

funcionó bien.


1
Tuvimos que agregarnpm i browserslist caniuse-lite --save
furtivo

3

Eliminación node_modulesy package-lock.jsony npm iresolver el problema para mí.


1
eliminar package-lock.json podría dar como resultado algún error de cambios importantes si tiene un largo historial de instalación de paquetes, por ejemplo, un proyecto que estuvo funcionando y desarrollado durante más de un año y tiene paquetes que tienen una gran cantidad de dependencia de tercer nivel. cambios importantes
kafinsalim

2

Como se menciona en la respuesta de Scott Kuhl, este problema se menciona en https://github.com/madskristensen/WebCompiler/issues/413

Para mí, ejecutar el comando npm i caniuse-lite- browserslistsolo funcionó durante aproximadamente 1/2 día antes de que volviera a ser un problema.

La siguiente solución, mencionada en la publicación, funciona mucho mejor. Esto actualiza el archivo node.js para que lo use en console.loglugar de console.warncuando devuelva estos errores.

Puede actualizar manualmente este archivo ubicado en C: \ Users \ [Username] \ AppData \ Local \ Temp \ WebCompiler [VersionNumber] \ node_modules \ browserslist

O, para que se haga automáticamente, agregue lo siguiente a su archivo .csproj de la siguiente manera:

  1. Haga clic derecho en el archivo del proyecto y seleccione "Descargar proyecto"
  2. Edite el archivo .csproj
  3. Pegue lo siguiente en el archivo del proyecto. Lo pegué hacia el final del archivo, antes de la </Project>etiqueta final y antes de que se importara el paquete del compilador web de compilación.
    <ItemGroup>
        <PackageReference Include="MSBuildTasks" Version="1.5.0.235">
            <PrivateAssets>all</PrivateAssets>
            <IncludeAssets>runtime; build; native; contentfiles; analyzers</IncludeAssets>
        </PackageReference>
    </ItemGroup>
    <PropertyGroup>
        <TempFolder>$([System.IO.Path]::GetTempPath())</TempFolder>
    </PropertyGroup>
    <ItemGroup>
        <BrowsersListNodeJsFiles Include="$(TempFolder)\WebCompiler*\node_modules\browserslist\node.js" />
    </ItemGroup>
    <Target Name="BrowsersListWarningsAsInfo" BeforeTargets="WebCompile">
        <FileUpdate Files="@(BrowsersListNodeJsFiles)"
                    Regex="console.warn"
                    ReplacementText="console.log" />
    </Target>

  1. Vuelva a cargar el proyecto en la solución.

¡Gracias! Esta fue la mejor solución para mí. ¡Las correcciones anteriores quedarían obsoletas cada dos días!
Bradly Bennison

2

He solucionado este problema haciendo, paso a paso:

  1. eliminar node_modules
  2. eliminar package-lock.json,
  3. correr npm --depth 9999 update
  4. correr npm install

1

También tuve el mismo problema, este comando funciona para mí

npm i autoprefixer@latest

Se añade automáticamente necesidad de dependencia en package.jsony package-lock.jsonarchivo, como a continuación:

package.json

"autoprefixer": "^9.6.5",

package-lock.json

"@angular-devkit/build-angular": {

...

"dependencies": {
    "autoprefixer": {
      "version": "9.4.6",
      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.4.6.tgz",
      "integrity": "sha512-Yp51mevbOEdxDUy5WjiKtpQaecqYq9OqZSL04rSoCiry7Tc5I9FEyo3bfxiTJc1DfHeKwSFCUYbBAiOQ2VGfiw==",
      "dev": true,
      "requires": {
        "browserslist": "^4.4.1",
        "caniuse-lite": "^1.0.30000929",
        "normalize-range": "^0.1.2",
        "num2fraction": "^1.2.2",
        "postcss": "^7.0.13",
        "postcss-value-parser": "^3.3.1"
      }
    },

...

  }

...

"autoprefixer": {
    "version": "9.6.5",
    "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.6.5.tgz",
    "integrity": "sha512-rGd50YV8LgwFQ2WQp4XzOTG69u1qQsXn0amww7tjqV5jJuNazgFKYEVItEBngyyvVITKOg20zr2V+9VsrXJQ2g==",
    "requires": {
      "browserslist": "^4.7.0",
      "caniuse-lite": "^1.0.30000999",
      "chalk": "^2.4.2",
      "normalize-range": "^0.1.2",
      "num2fraction": "^1.2.2",
      "postcss": "^7.0.18",
      "postcss-value-parser": "^4.0.2"
    },

...

}

1

No estoy exactamente seguro de dónde estaba mi problema, pero creo que fue porque estaba usando los mismos paquetes globales tanto de npm como de Yarn.

Desinstalé todos los paquetes globales de npm, luego, cuando volví a usar los comandos de yarn, el problema desapareció.

Para ver los paquetes globales instalados ...

para npm:

npm ls -g --depth=0

para hilo:

yarn global list

Luego desinstalé cada paquete que vi en la lista de npm, usando:

npm uninstall -g <package-name>

0

En Mac, eliminé node_modules y package-lock.json, luego ejecuté npm install y solucionó mi problema.


-1

Bajé la versión del nodo de 12 a 10

EDITAR

Este error ocurrió conmigo porque estaba usando la versión 12 del nodo. Cuando cambio a la versión 10.16.5, este error se detiene. Este error ocurrió en mi entorno local, pero en prod y staging, no sucede. En prod y la versión del nodo de ensayo es 10.x, así que simplemente hago esto y no necesitaba actualizar ningún paquete en mi package.json


2
¡Bienvenido a SO! Cuando publique una respuesta, incluso si es correcta, intente explicar un poco.
David García Bodego

No es una mala respuesta ... solo edítala un poquito y listo.
David García Bodego

-1

Para solucionar el problema, puede escribir el siguiente comando:

'npm -g actualización'



-1

Solución mínima que funcionó para mí para el proyecto actual.

  • Un proyecto create-react-app
  • Ubuntu / * nix
  • 2020
  • Nodo 14.7

eliminar node_modules/browserslistdirectorio en el proyecto

ahora

npm run build

ya no genera ese mensaje


Si usted acaba de eliminar el directorio, lo que pasa próxima vez que npm install/ npm ci?
jonrsharpe

En realidad, luego encontré un problema con css perfix, finalmente actualicé create-create-app para ese proyecto y todo estuvo bien.
Michael Durrant

-3

En mi caso esto funciona bien ...

sudo npm i -g browserslist caniuse-lite


2
Se recomienda encarecidamente no usar sudocon, npm install -gya que esto puede causar problemas de permisos. Si no puede instalar módulos globalmente, esto se debe a problemas de permisos ya existentes. Una búsqueda SO ayudará a resolverlo.
Brady Dowling
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.