Flutter中GoogleFonts无法加载字体的问题求助
我尝试使用GoogleFonts测试UI,但遇到异常错误:google_fonts was unable to load font,且所有字体都会触发该问题。以下是我的环境配置与相关信息:
- 环境:VSCode、Flutter 1.12.13+hf9、Windows 10
- pubspec.yaml依赖配置:
dependencies: flutter: sdk: flutter google_fonts: ^0.4.0
- 代码示例:
import 'package:google_fonts/google_fonts.dart'; Text('data2', style: GoogleFonts.mcLaren())
- 报错信息:
I/flutter ( 5069): error: google_fonts was unable to load font McLaren-Regular because the following exception occured
I/flutter ( 5069): Exception: Failed to load font with url: https://fonts.gstatic.com/s/a/ca48a5e17b0201057453d49c4271d139e5824b553505ad1c6fbbd7cbbbf4d1dc.ttf
- Flutter Doctor检测结果:
[√] Flutter (Channel stable, v1.12.13+hotfix.9, on Microsoft Windows, locale pt-BR)
[√] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[!] Android Studio (not installed)
[√] VS Code, 64-bit edition (version 1.44.0)
[√] Connected device (1 available)
! Doctor found issues in 1 category.
Hey,我之前在旧版Flutter搭配早期google_fonts包时也碰到过一模一样的问题,给你几个实用的解决方向:
1. 升级google_fonts包版本
你用的0.4.0版本太老了,和1.12.x的Flutter存在兼容性问题。建议升级到适配你当前Flutter稳定版的版本,比如^1.1.0就很合适:
修改pubspec.yaml里的依赖:
dependencies: flutter: sdk: flutter google_fonts: ^1.1.0
然后在终端执行flutter pub get更新依赖。
2. 排查网络连接问题
报错显示无法加载Google Fonts的CDN链接,大概率是网络访问受限导致的:
- 切换到其他网络(比如手机热点)测试,排除本地网络的限制
- 如果需要代理,在终端先配置代理再运行项目:
set HTTP_PROXY=http://你的代理地址:端口 set HTTPS_PROXY=http://你的代理地址:端口
之后重启Flutter运行会话试试。
3. 改用本地字体作为 fallback
如果网络问题暂时无法解决,可以把字体下载到本地托管:
- 从Google Fonts官网下载需要的字体文件(比如
McLaren-Regular.ttf) - 在项目根目录创建
assets/fonts文件夹,把字体文件放进去 - 在pubspec.yaml里配置本地资源和字体家族:
flutter: assets: - assets/fonts/ fonts: - family: McLaren fonts: - asset: assets/fonts/McLaren-Regular.ttf
- 修改代码兼容本地和远程加载:
Text('data2', style: GoogleFonts.mcLaren(fontFamily: 'McLaren'))
这样如果远程加载失败,会自动切换到本地的字体文件。
4. 考虑升级Flutter(可选但推荐)
你的Flutter版本1.12.x确实比较陈旧了,新版本对google_fonts这类包的支持更好。如果项目允许,执行flutter upgrade升级到最新稳定版——记得先备份项目,避免出现意外的兼容性问题。
内容的提问来源于stack exchange,提问作者rubStackOverflow




