Flutter 材质图标（用于网络）在发布模式下不起作用

Question

在为我的网站试用 flutter-web 时，我发现 Material Icons 在调试模式下呈现，但它们在发布模式下不起作用（被盒子取代）。

navBarMobile.dart

的代码在这里。

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:eva_icons_flutter/eva_icons_flutter.dart';
import 'package:portfolio/globals/myColors.dart';
import 'package:portfolio/globals/myDimens.dart';
import 'package:portfolio/globals/mySpaces.dart';
import 'package:portfolio/globals/myString.dart';

class NavBarMobile extends StatefulWidget {
  _NavBarMobileState createState() => _NavBarMobileState();
}

class _NavBarMobileState extends State<NavBarMobile> {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: MyDimens.double_125,
      color: MyColors.white,
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: MyDimens.double_20),
        child: Row(
          children: [
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Row(
                  children: [
                    Container(
                      width: MyDimens.double_16,
                      height: MyDimens.double_16,
                      color: MyColors.accentColor,
                    ),
                    MySpaces.hSmallestGapInBetween,
                    Text(
                      MyStrings.myName,
                      style: TextStyle(
                          color: MyColors.black,
                          fontFamily: 'poppins',
                          fontSize: MyDimens.double_20),
                    ),
                  ],
                ),
                MySpaces.vSmallestGapInBetween,
                Text(
                  MyStrings.myWork.toUpperCase(),
                  style: TextStyle(
                      letterSpacing: 0.5,
                      color: MyColors.black,
                      fontFamily: 'avenir-light',
                      fontSize: MyDimens.double_15),
                ),
              ],
            ),
            Spacer(),
            Icon(Icons.menu, color: MyColors.accentColor, size: MyDimens.double_40,),
          ],
        ),
      ),
    );
  }
}

这是我在笔记本电脑中的截图

1. 释放模式（使用

   flutter run --release

   ）

2.调试模式（使用

flutter run

）

其他细节：
浏览器 - Chrome
操作系统 - Ubuntu 20.04

Answer 1

既然我找到了出路，我想与面临同样问题的人分享。就我而言，我通过以下方式解决了这个问题：

1. 在

   MaterialIcons-Regular.tff

   目录中下载

   web/assets/fonts

   字体。
2. 在文件中添加

   [{"fonts":[{"asset":"fonts/MaterialIcons-Regular.ttf"}],"family":"MaterialIcons"}]

   web/assets/FontManifest.json

Answer 2

如果您的资产/图标在调试模式下工作并且在发布模式下没有显示，请考虑这个简单的 hack：

1. 在调试模式下运行网络应用程序。

2. 运行时，打开build文件夹，寻找

   flutter_assets

   文件夹：

    build/flutter_assets
   

3. 复制

   fonts

   文件夹和

   FontManifest.json

   来自

   flutter_assets

   .

4. 将它们粘贴到您的网络文件夹

   web/assets

   和TADAAA！

5. flutter clean

   >删除构建文件夹>

   flutter pub get

   >

   flutter run --release