angular - 无法为 WOFF、WOFF2 和 TTF 解码下载的字体
问题描述
https://celbux-frontend-ng.ew.r.appspot.com/
我无法让我的 Angular 前端与 tim-icons / fa-icons 一起工作,只有在它部署到 App Engine 之后。我收到以下错误:
Failed to decode downloaded font: https://celbux-frontend-ng.ew.r.appspot.com/nucleo.5987dd12fea78ce5f97a.woff2
home:1 OTS parsing error: invalid version tag
home:1 Failed to decode downloaded font: https://celbux-frontend-ng.ew.r.appspot.com/nucleo.f0b489a5dbbff08833d2.woff
home:1 OTS parsing error: invalid version tag
home:1 Failed to decode downloaded font: https://celbux-frontend.ng.ew.r.appspot.com/nucleo.b17a118e13e53558658b.ttf
home:1 OTS parsing error: invalid version tag
当我在 http://localhost:4200 本地运行程序时,字体确实有效。这些错误仅在我访问已部署的网站时出现。
很确定这是由于 app.yaml 处理路由的方式,我对此感到非常糟糕。这是我当前的 app.yaml。
runtime: python27
api_version: 1
threadsafe: true
handlers:
# Initial route that will serve up index.html, main entry point to your app
- url: /
secure: always
static_files: celbux-frontend-ng/index.html
upload: celbux-frontend-ng/.*
# Routing for typedoc, assets and favicon.ico to serve directly
- url: /((?:assets|docs)/.*|favicon\.ico)
secure: always
redirect_http_response_code: 301
static_files: celbux-frontend-ng/\1
upload: celbux-frontend-ng/.*
# Routing for any js files
- url: /(.*\.js)
secure: always
redirect_http_response_code: 301
static_files: celbux-frontend-ng/\1
upload: celbux-frontend-ng/.*\.js
# Routing for any css files
- url: /(.*\.css)
secure: always
redirect_http_response_code: 301
static_files: celbux-frontend-ng/\1
mime_type: text/css
upload: celbux-frontend-ng/.*\.css
# Routing for anything (wild card) after
- url: /.*
secure: always
static_files: celbux-frontend-ng/index.html
upload: celbux-frontend-ng/.*
所以问题是,我怎样才能让我的路由在部署时在这里工作,所以我没有收到 OTS 解析错误和字体解码错误。
谢谢!
解决方案
在你的 app.yaml 中尝试这样的事情:
runtime: nodejs12
handlers:
- url: /
static_files: dist/index.html
upload: dist/index.html
- url: /(.*)
static_files: dist/\1
upload: dist/.*
app.yaml 必须位于项目的根目录
推荐阅读
- laravel - 返回选择性行 Laravel Eloquent
- javascript - 如何使用 Jest 在 TypeScript 中使用 Props 测试 React 组件?
- javascript - 联系人页面中的 Outlook 加载项
- android - 应用程序包的 FCM 目标是如何在 Composer 中的控制台而不是在 API 中工作的?
- python - 与 SQL Developer 相比,cx_Oracle 中的结果不同
- python - 如何在python中为自定义异常定义IDLE calltip
- javascript - 如何识别在 React 中单击了哪个菜单项?
- html - 滚动捕捉不适用于以下代码。我如何解决它?(我正在使用最新版本的 chrome)
- react-native - 尝试在我的 App 组件中使用 ref 但出现错误 Function components can be given refs
- python - /'xxx' 处的 TemplateSyntaxError 不是已注册的标签库。必须是以下之一: