Daftar peramban: caniuse-lite sudah usang. Jalankan perintah berikutnya `npm update caniuse-lite browserlist`

97

Baru-baru ini, ketika saya mengkompilasi file scss saya, saya mendapatkan kesalahan. Pesan kesalahan mengatakan:

Daftar peramban: caniuse-lite sudah usang. Silakan jalankan perintah selanjutnyanpm update caniuse-lite browserslist

Pertama, seperti yang tertulis di pesan, saya menjalankan npm update caniuse-lite browserslisttetapi tidak memperbaiki masalah. Saya menghapus seluruh direktori nod-modules dan menginstal lagi, juga saya memperbarui seluruh folder npm updatetetapi tidak ada yang menyelesaikan masalah. Saya juga menginstal ulang autoprefixer dan daftar browser tetapi tidak satupun dari mereka menyelesaikan masalah.

Jika saya menghapus 

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

dari saya compilerconfig.json, semuanya berfungsi dengan baik yang berarti mungkin itu terkait dengan autoprefixer. Juga, saya secara manual mengubah versi paket ke versi terbaru package.jsondan menginstal ulang tetapi tidak berhasil.

npm  sass  autoprefixer  web-compiler 
— Mehrdad Babaki
sumber

Jawaban:

45

Sepertinya Anda menggunakan ekstensi Kompilator Web Visual Studio. Ada masalah terbuka untuk ini ditemukan di sini: https://github.com/madskristensen/WebCompiler/issues/413

Ada solusi yang diposting dalam masalah itu:

  1. Tutup Visual Studio
  2. Kepala ke C:\Users\USERNAME\AppData\Local\Temp\WebCompilerX.X.X(X adalah versi WebCompiler)
  3. Hapus folder berikut dari node_modulesfolder: caniuse-litedan browserslist Buka CMD (di dalam C:\Users\USERNAME\AppData\Local\Temp\WebCompilerX.X.X) dan jalankan:npm i caniuse-lite browserslist
— Scott Kuhl
sumber
1
Saya melakukannya dan saya tidak mengalami kesalahan itu lagi tetapi saya mendapat kesalahan baru: Kesalahan Plugin: Tidak dapat menemukan modul 'autoprefixer'. Saya mencoba menginstal ulang dan memperbarui autoprefixer tetapi saya masih mendapatkan kesalahan itu.
— Mehrdad Babaki
Kedengarannya seperti masalah yang berbeda. Jika Anda memiliki tautan ke proyek Anda secara online atau dapat menyusun proyek lain yang bermasalah, saya akan dengan senang hati melihatnya.
— Scott Kuhl
Sepertinya ketika saya mencoba memperbaiki masalah dengan meningkatkan dan menginstal ulang autoprefixer saya telah merusak sesuatu. Untungnya, hari ini Web Compiler memperbarui dirinya sendiri dan saya melihat pesan kesalahan itu lagi. Saya mengikuti langkah-langkah di atas dan kali ini masalah diperbaiki.
— Mehrdad Babaki
Tahu di mana direktori ini di mac?
— Safa Alai
48

Coba ini memecahkan masalah saya npx browserslist@latest --update-db

— Dipanker Shah
sumber
2
Untuk konteks: IDE saya adalah VS Code, dan proyek JS saya hanya menyertakan Parcel, react, dan react-dom ketika saya mulai melihat kesalahan ini. Tak satu pun dari opsi di atas berfungsi. Solusi ini memperbaiki milik saya.
— Klay
Gagal di Windows `` C: \ projects \ ember-cli-typescript-blueprints> npx browserlist @ latest --update-db npm ERR! cb.apply bukanlah fungsi npm ERR! Log lengkap dari proses ini dapat ditemukan di: npm ERR! c: \ npm \ cache_logs \ 2020-11-15T14_19_08_958Z-debug.log Instal untuk ['browserlist @ latest'] gagal dengan kode 1 ``
— bryan.crotaz
31

Untuk Pengembang Angular

Meskipun, saya menjawab ini sangat terlambat. Saya memiliki kebiasaan buruk memeriksa changelogs dari setiap perpustakaan yang saya gunakan 😀 dan saat memeriksa catatan rilis CLI Angular, saya menemukan bahwa mereka merilis tambalan baru kemarin (9 Jan 2020) yang memperbaiki masalah ini.

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

Jadi ketika Anda akan menjalankan ng update, Anda harus mendapatkan pembaruan untuk @angular/cli:

masukkan deskripsi gambar di sini

Dan menjalankannya ng update @angular/cliakan memperbaiki peringatan ini.

Bersulang!

— Shashank Agrawal
sumber
19

Saya menemukan jalan pintas daripada melalui vs code appData/webCompiler, saya menambahkannya sebagai ketergantungan pada proyek saya dengan cmd ini npm i caniuse-lite browserslist . Tetapi Anda mungkin menginstalnya secara global untuk menghindari penambahannya ke setiap proyek.

Setelah instalasi, Anda dapat menghapusnya dari proyek Anda package.jsondan melakukannya npm i.

Memperbarui:

Jika, solusi Di atas tidak memperbaikinya. Anda dapat menjalankannya npm update, karena ini akan meningkatkan paket yang tidak lagi digunakan / usang.

catatan:

Setelah Anda menjalankan pembaruan npm, mungkin ada dependensi yang hilang. Lacak kesalahan dan instal dependensi yang hilang. Punyaku adalah nodemon, yang aku perbaikinpm i nodemon -g

— akolliy
sumber
4
Saya tidak memiliki folder / WebCompiler di folder / TEMP saya seperti yang disarankan oleh beberapa posting lain di sini, jadi saya menjalankan baris perintah ini dan tampaknya telah memperbaiki masalah tersebut.
— AppDreamer
13

Kelanjutan dari jawaban di atas .

Memiliki "kesalahan plugin" yang sama dengan @MehrdadBabaki. Saya mencopot kompiler web, menghapus folder AppData WebCompiler yang disebutkan di atas, lalu membuka kembali VS2019 dan menginstal ulang kompiler web.

LALU saya pergi ke folder WebCompiler lagi dan melakukan npm i autoprefixer@latest npm i caniuse-lite@latestdannpm i caniuse-lite browserslist@latest

— dirq
sumber
cukup perbarui autoprefixer, caniuse-lite, daftar browser bagus untuk saya
— cwhsu
10

npm --depth 9999 updatememperbaiki masalah untuk saya - tampaknya karena package-lock.jsonbersikeras pada versi yang sudah ketinggalan zaman.

— Brett Zamir
sumber
12
Bahkan npm --depth 99 update caniuse-lite browserslistdisebabkan JavaScript heap out of memorydalam proyek saya, tetapi npm --depth 20 update caniuse-lite browserslistberjalan cepat dan menyelesaikan kesalahan dalam kasus saya.
— Alexandr Nil
6

Dalam kasus saya, saya menghapus caniuse-lite, browserslistfolder dari node_modules.

Kemudian saya mengetik perintah berikut untuk menginstal paket. 

npm i -g browserslist caniuse-lite --save

bekerja dengan baik.

— Gebru Welay Gerezigiher
sumber
2
Kami harus menambahkannpm i browserslist caniuse-lite --save
— licik
3

Menghapus node_modulesdan package-lock.jsondan npm imemecahkan masalah bagi saya.

— CK
sumber
3
menghapus package-lock.json dapat mengakibatkan beberapa kesalahan perubahan kerusakan jika Anda memiliki sejarah panjang instalasi paket, misalnya proyek yang bekerja dan dikembangkan selama lebih dari satu tahun dan memiliki paket yang memiliki banyak ketergantungan tingkat 3 dapat dibuat melanggar perubahan
— kafinsalim
2

Seperti disebutkan dalam jawaban Scott Kuhl, masalah ini disebutkan di https://github.com/madskristensen/WebCompiler/issues/413

Bagi saya, menjalankan perintah npm i caniuse-lite- browserslisthanya berfungsi sekitar 1/2 hari sebelum itu menjadi masalah lagi.

Solusi berikut, yang disebutkan dalam posting, bekerja jauh lebih baik. Ini memperbarui file node.js sehingga digunakan console.logsebagai pengganti console.warnsaat mengembalikan kesalahan ini.

Anda dapat memperbarui file ini secara manual yang terletak di C: \ Users \ [Username] \ AppData \ Local \ Temp \ WebCompiler [VersionNumber] \ node_modules \ browserlist

Atau, agar dilakukan secara otomatis, tambahkan berikut ini ke file .csproj Anda dengan:

  1. Klik kanan pada file proyek dan pilih "Unload Project"
  2. Edit file .csproj
  3. Tempel berikut ini ke dalam file proyek. Saya menempelkannya di bagian akhir file, sebelum </Project>tag akhir dan sebelum paket kompiler web build diimpor.
    <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. Muat ulang proyek kembali ke dalam solusi.
— Sylvia
sumber
Terima kasih! Ini adalah perbaikan terbaik untuk saya. Perbaikan di atas akan menjadi usang setiap hari!
— Bradly Bennison
2

Saya telah memperbaiki masalah ini dengan melakukan, langkah demi langkah:

  1. menghapus node_modules
  2. hapus package-lock.json,
  3. Lari npm --depth 9999 update
  4. Lari npm install
— Bartek
sumber
Berhati-hatilah package-lock.jsonsaat melepas karena dapat menyebabkan perubahan yang merusak dan harus dihindari.
— Liam
1

Saya memiliki masalah yang sama juga perintah ini bekerja untuk saya

npm i autoprefixer@latest

Ini secara otomatis menambahkan ketergantungan package.jsondan package-lock.jsonfile seperti di bawah ini:

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"
    },

...

}
— Samet ÇELİKBIÇAK
sumber
1

Saya tidak yakin di mana masalah saya, tapi saya yakin itu karena saya menggunakan paket global yang sama dari npm dan Yarn.

Saya mencopot semua paket global npm, lalu ketika menggunakan perintah benang sekali lagi, masalahnya hilang.

Untuk melihat paket global diinstal ...

untuk npm:

npm ls -g --depth=0

untuk Benang:

yarn global list

Saya kemudian menghapus setiap paket yang saya lihat di daftar npm, menggunakan:

npm uninstall -g <package-name>
— tno2007
sumber
1

Jawaban dari @Alexandr Nil aman, dan efektif untuk saya

Saya menulis sebagai jawaban lengkap karena mudah untuk melewatkan komentarnya.

npm --depth 20 update caniuse-lite browserslist

Ini bagus karena:

  1. Tidak ada penghapusan package-lock.json. Menghapus yang membuat Anda rentan terhadap banyak paket yang ditingkatkan dengan perubahan yang merusak.

  2. Ini eksplisit dan sangat terbatas pada hal-hal yang akan diperbarui.

  3. Ini menghindari kedalaman yang sangat besar dari 99 atau 9999 yang akan bekerja pada beberapa proyek dan sistem, tetapi tidak pada yang lain. Jika Anda membatasi kedalaman pada angka yang terlalu kecil, itu tidak akan merusak apa pun. Anda dapat meningkatkan kedalaman dan mencoba lagi, hingga proyek berhasil dikompilasi.

— Eureka
sumber
0

Banyak yang menyarankan Anda untuk menghapus package-lock.jsonatauyarn.lock . Ini jelas ide yang buruk!

Saya menggunakan Yarn dan saya bisa memperbaiki masalah ini dengan hanya menghapus entri caniuse-dbdan caniuse-litedi saya yarn.lockdan melakukan ayarn .

Tidak perlu merusak fungsi utama lockfile dengan menghapusnya.

— Kévin Berthommier
sumber
-1

Saya menurunkan versi node dari 12 menjadi 10

EDIT

Kesalahan ini terjadi pada saya karena saya menggunakan node versi 12. Ketika saya menurunkan versi ke versi 10.16.5 kesalahan ini berhenti. Error ini terjadi di local env saya, tapi pada prod dan staging tidak terjadi. Dalam prod dan versi node staging adalah 10.x jadi saya hanya melakukan ini dan saya tidak perlu memperbarui paket apa pun di package.json saya

— Murilo Ângelo
sumber
2
Selamat datang di SO! Saat Anda memposting jawaban, meskipun benar, coba jelaskan sedikit.
— David García Bodego
Ini bukan jawaban yang buruk ... cukup edit sedikit dan selesai.
— David García Bodego
-1

Untuk memperbaiki masalah Anda dapat mengetikkan perintah di bawah ini:

'pembaruan npm -g'

— Virendra
sumber
-1

Jika Anda menggunakan benang:

yarn upgrade

Bantuan untukku

— TriSTaR
sumber
-1

Solusi minimal yang berhasil untuk saya untuk proyek saat ini

  • Sebuah proyek buat-reaksi-aplikasi
  • Ubuntu / * nix
  • 2020
  • Simpul 14.7

hapus node_modules/browserslistdirektori dalam proyek

sekarang

npm run build

tidak lagi menghasilkan pesan itu

— Michael Durrant
sumber
Jika Anda baru saja menghapus direktori, apa yang terjadi lain kali Anda npm install/ npm ci?
— jonrsharpe
Sebenarnya saya kemudian mengalami masalah dengan css perfix, akhirnya saya memperbarui aplikasi buat-buat untuk proyek itu dan semuanya baik-baik saja.
— Michael Durrant
-1

Di Mac, saya menghapus node_modules dan package-lock.json, lalu menjalankan npm install dan memperbaiki masalah saya.

— Safa Alai
sumber
1
Seperti disebutkan di atas, berhati-hatilah saat melepas package-lock.json. Hal ini dapat menyebabkan perubahan yang merusak dan harus dihindari.
— Liam
-3

Dalam kasus saya ini berfungsi dengan baik ...

sudo npm i -g browserslist caniuse-lite

— Biruel Rick
sumber
2
Sangat disarankan untuk tidak menggunakan sudodengan npm install -gkarena ini dapat menyebabkan masalah izin. Jika Anda tidak dapat menginstal modul secara global, ini memang disebabkan oleh masalah izin yang sudah ada. Pencarian SO akan membantu dengan cara mengatasinya.
— Brady Dowling
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.