Sass 加载器无法使用 Encore webpack 和 Symfony 5 加载 url

问题描述

我更新了 Encore webpack 及其依赖项。因为，我有这个错误：

错误：无法解决 '/fonts/Basier-Circle-medium-webfont/basiercircle-medium-webfont.woff' 在 'E:\Projets web\Roadtripr\roadtripr\assets\css' 在运行微任务()

字体文件位于 public/fonts 目录中。

编辑：

有@font-face 声明：

/* Basier */
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-regular-webfont/basiercircle-regular-webfont.woff') format('woff'),url('/fonts/Basier-Circle-regular-webfont/basiercircle-regular-webfont.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-regular-webfont/basiercircle-regular-webfont.woff') format('woff'),url('/fonts/Basier-Circle-regular-webfont/basiercircle-regular-webfont.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-medium-webfont/basiercircle-medium-webfont.woff') format('woff'),url('/fonts/Basier-Circle-medium-webfont/basiercircle-medium-webfont.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-semibold-webfont/basiercircle-semibold-webfont.woff') format('woff'),url('/fonts/Basier-Circle-semibold-webfont/basiercircle-semibold-webfont.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-bold-webfont/basiercircle-bold-webfont.woff') format('woff'),url('/fonts/Basier-Circle-bold-webfont/basiercircle-bold-webfont.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Basier';
  src: url('/fonts/Basier-Circle-bold-webfont/basiercircle-bold-webfont.woff') format('woff'),url('/fonts/Basier-Circle-bold-webfont/basiercircle-bold-webfont.woff2') format('woff2');
  font-weight: bold;
  font-style: normal;
}

解决方法

不要将字体文件放在 public 目录中。

将它们放入 assets/fonts。像这样的图片：

E:\Projets web\Roadtripr\roadtripr
|- bin/
|- config/
|- assets/
|    |- css/
|    |- fonts/
|- src/
|- public/

When you run `yarn encore` the file fonts referenced by `url()` declarations will be copied to your `public/build` directory automatically.

,

可能有点晚 但我遇到了同样的问题并通过将字体文件移动到 assets/css 文件夹（与您的 CSS 文件相同的文件夹）来修复它 并将 CSS 文件中的路径从 url ("/fonts/....") 更改为 url ("nameoffolder")