Danh sách trình duyệt góc: caniuse-lite đã lỗi thời. Vui lòng chạy lệnh tiếp theo `npm update`

Gần đây tôi đã bắt đầu gặp lỗi này trong dự án Angular 8 (nút v10.16.0) mà tôi đang làm việc. Chạy npm cập nhật danh sách trình duyệt caniuse-lite không làm gì cả

Vì vậy, tôi đã gỡ bỏ gói-lock.json, loại bỏ node_modules và chạy cài đặt npm, nhưng tệp danh sách trình duyệt đã biến mất. Một lần nữa khi tôi chạy ng build, tôi nhận được thông báo tương tự: Danh sách trình duyệt: caniuse-lite đã lỗi thời. Vui lòng chạy lệnh tiếp theonpm update

Tôi thấy bài đăng này về cùng một chủ đề: Danh sách trình duyệt: caniuse-lite đã lỗi thời. Vui lòng chạy lệnh tiếp theo `npm update caniuse-lite browserlist` Tuy nhiên, nó nói về WebCompiler và autoprefixer và tôi không biết gì về chúng. Xin hướng dẫn

Giải quyết vấn đề lỗi thời caniuse-lite bằng cách chạy bên dưới các lệnh.

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

TLDR: (có vẻ phản trực giác mà không cần giải thích)

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

Giải trình:

Thông báo cảnh báo này ("canisuse-lite đã lỗi thời, vui lòng ....") được xuất ra bởi các tập lệnh trong danh sách trình duyệt trong quá trình xây dựng / khởi động nếu nó tìm thấy phiên bản cài đặt của caniuse-lite cũ hơn 2 phiên bản từ phiên bản hiện tại. Nếu không có gì trong dự án của bạn thay đổi và bạn đột nhiên thấy thông báo này khi bắt đầu hoặc xây dựng dự án của mình, điều đó có thể có nghĩa là đã có bản cập nhật phiên bản gần đây cho caniuse-lite.

Thật không may, thông điệp văn bản mà trình duyệt danh sách hiển thị chỉ hữu ích nếu bạn cài đặt caniuse-lite như một phần phụ thuộc của dự án của bạn. Rất có thể, bạn đã không làm thế. Vì vậy, khi bạn chạy bản cập nhật 'npm cập nhật caniuse-lite' hoặc 'npm update' caniuse-lite @ mới nhất '(hoặc' npm install '), npm không thấy gói đó được liệt kê trong các phụ thuộc của gói.json, vì vậy nó bỏ qua yêu cầu.

Làm thế nào mà các gói đó trở thành phụ thuộc sau đó? Khi dự án của bạn được tạo (có thể với ứng dụng angularapp hoặc ứng dụng tạo phản ứng hoặc tương tự cho khung của bạn), npm đã cài đặt danh sách trình duyệt như một sự phụ thuộc của các công cụ cần thiết, không phải là một trong những phụ thuộc của dự án. Đồng thời, caniuse-lite đã được cài đặt như một phần phụ thuộc của danh sách trình duyệt. Sau này khi dự án được cập nhật, một tệp pack-lock.json đã được tạo để khóa tất cả các phụ thuộc vào một phiên bản cụ thể.

Nếu bạn có thể cập nhật thông tin phiên bản trong danh sách các phụ thuộc trong gói-lock.json, thì việc chạy 'npm install' sẽ cập nhật các gói này trong node_modules. Bạn không nên chỉnh sửa gói-lock.json theo cách thủ công. Thay vào đó, cách tốt nhất để làm điều đó là:

1. Tạm thời biến các gói này thành một phụ thuộc của dự án của bạn:

   npm cài đặt danh sách trình duyệt caniuse-lite

   Ngoài việc cập nhật gói lên phiên bản mới nhất, bản cập nhật này còn cập nhật danh sách phụ thuộc trong cả gói.json và (quan trọng nhất) là gói-lock.json.

2. Xóa các gói này dưới dạng phụ thuộc trực tiếp của dự án của bạn:

   npm gỡ cài đặt danh sách trình duyệt caniuse-lite

   Vì các gói này được sử dụng bởi các phụ thuộc khác, chúng không bị xóa khỏi node_modules. Chỉ gói.json được cập nhật để loại bỏ chúng như một phụ thuộc dự án.

3. Cam kết gói-lock.json. Bây giờ, bất kỳ ai khác cũng có thể chạy 'npm install' để nhận hai gói được cập nhật từ danh sách các phụ thuộc phụ trong gói-lock.json và dừng thông báo cảnh báo.