最近,当我编译我的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和重新安装,但没有运气。


当前回答

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

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

更新:

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

注意:

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

其他回答

NPM——深度9999更新为我修复了这个问题——显然是因为包锁。Json坚持使用过时的版本。

对我来说最有效的方法是首先建立一个项目

NPM运行构建

然后运行它

NPM运行启动

这将消失错误和应用程序加载良好。

正如Scott Kuhl的回答中提到的,这个问题在 https://github.com/madskristensen/WebCompiler/issues/413

对我来说,运行命令npm i canius -lite- browserslist只工作了大约1/2天,就再次出现问题。

下面的解决方案,在帖子中提到,工作得更好。这将更新node.js文件,使其使用console.log而不是console。返回这些错误时发出警告。

您可以手动更新位于 C:\Users\【用户名】当地\ AppData \ \ Temp \ WebCompiler VersionNumber \ node_modules \ browserslist

或者,为了自动完成,将以下内容添加到.csproj文件中:

右键单击项目文件,选择“卸载项目” 编辑.csproj文件 将以下内容粘贴到项目文件中。我将它粘贴到文件的末尾,在</Project>结束标记之前,在导入构建web编译器包之前。

    <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>

重新加载项目到解决方案中。

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

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

...

}

继续上面的回答。

有相同的“插件错误”@MehrdadBabaki。我卸载了web编译器,删除了上面提到的AppData WebCompiler文件夹,然后重新打开VS2019,重新安装了web编译器。

然后我又去了WebCompiler文件夹,做了npm I autoprefixer@latest npm I caniuse-lite@latest和npm I caniuse-lite browserslist@latest