1

我们有一个现有的 Angular 项目，具有这样scss的设置架构，但是在使用 Angular cli v11 升级到 Angular v11 后，我们面临这个问题，无法找到导致它的原因这个

有人可以帮助我们吗？

我也创建了stackblitz。

先感谢您。

Error: ./src/app/app.component.scss
Module Error (from ./node_modules/postcss-loader/dist/cjs.js):
(Emitted value instead of an instance of Error) CssSyntaxError: C:\Users\VNelapati\Projects\NXT_Gen\app.component.scss:11:4: Can't resolve './assets/iconscaret-down-blue-16.png' in 'C:\Users\VNelapati\Projects\NXT_Gen\ax-upgrade\angular11\src\app'

   9 |     right: 16px;
  10 |     cursor: pointer;
> 11 |     background-image: url($icon-url +"caret-down-blue-16.png");
     |    ^
  12 | }
  13 |
4

2 回答 2

1

我已经克隆了你的 repo而不是你的 stackblitz，因为有些实例 Stackblitz 无法识别绝对路径scss imports

已找到问题并为了解决您的问题：

1.) 把你/的start和放在你的：end$icon-url_variables.scss

$icon-url: "/assets/icons/";

2.) 在你的app.component.scss

删除@import "../style/app.scss";，因为这variables已经在您的standardsscss 文件中导入，因此非常多余。就像这样：

@import "standards";


body {
    width: 24px;
    height: 24px;
    top: 16px;
    right: 16px;
    cursor: pointer;
    background-image: url($icon-url +"caret-down-blue-16.png");
}
于 2020-12-01T08:21:59.303 回答
0

你的网址有问题。根据您的 stakckbliz，您icons里面有一个文件夹，assets但错误告诉您它正在尝试访问./assets/iconscaret-down-blue-16.png. 你想要./assets/icons/caret-down-blue-16.png，所以在其中添加斜杠$icon-url或在它之前附加caret-down-blue-16.png。如果您有多个图标，第一个选项会更好，因此您可以进行全局修复

于 2020-12-01T07:19:14.520 回答