Flutter Web应用中如何正确使用中文字体显示汉字？

以下是针对中文字体未生效问题的排查和解决步骤：

1. 修正pubspec.yaml中的路径分隔符 #

Flutter统一使用**正斜杠(/)**作为路径分隔符，你当前配置里用了反斜杠(\)，会导致Web端无法正确识别字体文件路径。修改后的配置：

fonts:
  - family: Chinese
    fonts:
      - asset: assets/fonts/MaShanZheng-Regular.ttf

2. 确认字体文件路径和配置匹配 #

• 检查assets/fonts/目录下是否确实存在MaShanZheng-Regular.ttf文件，文件名（包括大小写）要和配置完全一致。
• 确保assets目录已在pubspec.yaml中声明（未添加则补充）：

  assets:
    - assets/fonts/
  

3. 更新依赖并清理缓存 #

• 执行flutter pub get让配置生效。
• 清理Web端缓存后重新构建：

  flutter clean
  flutter build web --release
  

4. Web端手动引入字体（可选） #

部分Web环境下自动加载字体可能失效，可在web/index.html的<head>标签中手动添加：

<style>
  @font-face {
    font-family: 'Chinese';
    src: url('assets/fonts/MaShanZheng-Regular.ttf') format('truetype');
  }
</style>

5. 验证Text组件配置 #

确认Text组件的fontFamily值和pubspec中配置的family完全一致（此处为"Chinese"，注意大小写）。

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