如何仅为Flutter移动端打包字体资产而不包含Web端？

方法1：Dart条件编译 + Google Fonts多端适配 #

Google Fonts包支持同时加载本地字体和网络字体，结合Dart内置的kIsWeb常量，可在代码中无缝切换加载逻辑，无需修改构建流程：

1. 保留pubspec.yaml中的字体资产配置（确保移动端正常打包）
2. 在使用字体的代码中添加平台判断：

import 'package:flutter/foundation.dart';
import 'package:google_fonts/google_fonts.dart';

TextStyle getAppFontStyle() {
  if (kIsWeb) {
    // Web端直接调用Google Fonts网络字体，不依赖本地资产
    return GoogleFonts.yourCustomFont(); // 替换为你使用的字体名称
  } else {
    // 移动端加载本地字体文件
    return GoogleFonts.yourCustomFont(
      fontAssets: GoogleFonts.yourCustomFontFontAssets,
    );
  }
}

Web端会自动从Google Fonts CDN拉取字体，不会触发本地资产加载；移动端则优先使用打包后的本地字体，避免网络请求。

方法2：构建命令排除Web端字体资产 #

如果希望Web构建时完全不打包字体文件，可通过flutter build的--exclude-assets参数过滤字体目录，配合代码层面的平台判断：

1. 保留pubspec.yaml的字体配置（移动端正常打包）
2. 构建Web应用时执行以下命令：

flutter build web --exclude-assets=assets/fonts/**

注意：将assets/fonts/**替换为你实际的字体文件路径通配符，比如字体放在assets/custom_fonts/就改成assets/custom_fonts/**。
3. 代码逻辑同方法1，Web端使用网络字体，移动端使用本地字体。

这个方法彻底避免了Web端打包冗余字体资产，且仅需修改构建命令，代码改动极小。

方法3：拆分pubspec配置（适合复杂资产场景） #

若不想每次构建Web都手动添加参数，可拆分两个pubspec文件：

• pubspec.yaml：默认包含字体资产（供移动端构建使用）
• pubspec_web.yaml：移除flutter/assets下的字体配置（供Web构建使用）

构建时指定对应配置文件：

# 移动端构建（默认用pubspec.yaml）
flutter build apk
# Web端构建
flutter build web --pubspec=pubspec_web.yaml

该方法需要维护两份pubspec，适合资产较多、需频繁切换配置的场景。

内容的提问来源于stack exchange，提问作者Long Dang