如何在 Flutter Web 上启用自定义图标？

Question

我有自定义图标，可以在 IOS 和 Android 上正常工作。当我在 Web 上部署时，应用程序中应该出现我的图标的每个位置都出现了一个划掉的框。

控制台中出现的错误如下：

Could not find a set of Noto fonts to display all missing characters. Please add a font asset for the missing characters.

当我查看 Flutter Design Fonts 上的文档时，我发现我已按照这些步骤操作。

我的自定义图标 (fishfarm.ttf) 位于资产文件夹中。在 pubspec.yaml 我有以下内容：

  fonts:
   - family: FishFarm
     fonts:
      - asset: assets/fishfarm.ttf

我可以在 IOS 和 Android 中使用我的图标 Icon(FishFarm.nombreicono)

如何在 Flutter Web 中使用自定义图标？

Answer 1

快速修复是使用 html 渲染器构建您的网络应用程序。

建设

flutter build web --web-renderer html

或运行

flutter run -d chrome --web-renderer html

但它可能会在 pc 浏览器上表现不佳，因为 flutter web 在 pc 浏览器上使用 canvaskit 渲染器以获得更好的性能，并在移动浏览器上使用 html 渲染器。

How to enable Custom Icons on Flutter Web?