最近,当我编译我的scss文件时,我得到一个错误。错误信息如下:

Browserslist: canius -lite已经过时。请运行下一个命令npm update canius -lite browserslist

首先,正如消息所说,我运行npm update canius -lite browserslist,但它没有解决这个问题。 我删除了整个node_modules目录并重新安装,我也通过npm update更新了整个文件夹,但没有一个解决了这个问题。 我还重新安装了autoprefixer和browserslist,但没有一个解决问题。

如果我移除

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

从我的编译配置。Json,一切都很好,这意味着它可能与autoprefixer有关。另外,我手动将包版本更改为包上的最新版本。Json和重新安装,但没有运气。


当前回答

我降级节点版本,然后重新安装节点模块,问题已经解决。我是17岁。X到14.5.0

其他回答

我发现了一个捷径,而不是通过vs code appData/webCompiler,我添加它作为一个依赖到我的项目与这个cmd npm I caniuse-lite浏览器列表。但是您可以全局安装它,以避免将它添加到每个项目中。

安装后,可以将其从项目包中删除。Json和做NPM i。

更新:

以防万一,上面的解决方案没有解决它。你可以运行npm update,因为这会升级已弃用/过时的包。

注意:

运行npm更新后,可能会丢失依赖项。跟踪错误并安装缺少的依赖项。我的是nodemon,我修复了npm I nodemon -g

我也有同样的问题,这个命令对我有用

NPM I autoprefixer@latest

它自动在包中添加需要的依赖项。Json和包锁。Json文件如下:

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

...

}

我已经一步一步地解决了这个问题:

删除node_modules 删除package-lock.json, 运行NPM——depth 9999 update 运行NPM install

有一个环境变量>= 4.5.4,BROWSERSLIST_IGNORE_OLD_DATA,您可以将其设置为true来抑制警告(BROWSERSLIST_IGNORE_OLD_DATA=true)。添加BROWSERSLIST_IGNORE_OLD_DATA环境变量。

下面是来自该提交的相关代码片段,显示了检查该环境变量时的早期救助:

module.exports = {
  // ...
  oldDataWarning: function oldDataWarning (agentsObj) {
    if (dataTimeChecked) return
    dataTimeChecked = true
    if (process.env.BROWSERSLIST_IGNORE_OLD_DATA) return

    // ...
    console.warn(
      'Browserslist: caniuse-lite is outdated. ' +
      'Please run next command `' + command + '`'
    )
    // ...
  }
  // ...
}

简单、安全的解决方案

来自@Alexandr Nil的答案是安全的,对我来说很有效。我写的是一个完整的答案,因为很容易忽略他的评论。

npm --depth 20 update --save caniuse-lite browserslist 

这很好,因为:

There is no deletion of package-lock.json. Deleting that would leave you vulnerable to many packages getting upgraded with breaking changes, and you have a much bigger headache than you had before! It is easy to understand exactly what it is doing, because it is explicit and very limited on what is to be updated. It avoids the very large depth of 99 or 9999 which will work on some projects and systems, but not on others. If you have limited the depth to too small a number, it will not break anything. You can increase the depth and try again, until the project compiles successfully. I don't know whether I actually needed 20, or could have managed with a smaller depth, such as 5 or 10. But with a depth of 20 took less than a minute to run. It is quick and easy!

感谢@Zbyszek建议添加“——save”选项。是的,——depth目前已弃用,但我认为他们会用其他东西取代它,而不是完全删除它,所以现在这似乎是破坏性最小的方法。