Angular 找不到资产静态文件

Question

问题：解析资产文件夹内的字体会导致 404 Not Found 错误。 http://server.com/assets/fonts/Bold/RobotoCondensed-Bold.woff2

它适用于本地开发： http://localhost/assets/fonts/Bold/RobotoCondensed-Bold.woff2

详情：我有一些字体在资产文件夹中。它们被正确复制到 docker 图片路径：/usr/share/nginx/html/assets/fonts/Bold/RobotoCondensed-Bold.woff2

如果我要求http://server.com/service/assets/fonts/Bold/RobotoCondensed-Bold.woff2 然后检索我的字体。 /service 前缀是服务的示例名称。

在 server.com

上，本地开发人员的基础 href 从 <base href="/"> 更改为 <base href="/service/">

我该如何解决这个问题。我可以尝试将 url 从 /assets/fonts/Light/RobotoCondensed-Light.woff 更改为 service/assets/fonts/Light/RobotoCondensed-Light.woff 但是在本地开发期间这个前缀不存在所以我的字体将停止在本地环境中工作。

我还想提一下，我的 favicon.ico 得到了正确的服务。在本地环境中，前面没有前缀，在服务器上，它请求带有前缀/service 的图标。 Favicon 仅在 index.html:

中被提及

<link rel="icon" type="image/x-icon" href="favicon.ico" />

_fonts.scss 文件:

@font-face {
    font-family: 'Roboto Condensed';
    src: url('/assets/fonts/Light/RobotoCondensed-Light.woff2') format('woff2'),
        url('/assets/fonts/Light/RobotoCondensed-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

angular.json 文件:

"assets": [
    "projects/service/src/favicon.ico",
    "projects/service/src/assets"
],
"styles": [
    "projects/service/src/assets/scss/modules/_fonts.scss"
],

我对 angular 和前端还很陌生，无法解决这个问题。非常感谢任何帮助。

Answer 1

我需要在我的网址中使用相对路径例如

./assets/fonts/Light/RobotoCondensed-Light.woff

Angular 找不到资产静态文件

Angular assets static files not found

css

angular

nginx

fonts

static-files