React Native设置fontWeight为500不生效，仅bold和normal可用求解决方案

问题根源 #

React Native 对字体权重的支持完全依赖于目标平台的系统字体是否包含对应字重的变体。如果系统默认字体没有500字重的版本，设置fontWeight: '500'会自动回退到最接近的bold或normal。

可行解决方案 #

1. 引入支持500字重的自定义字体 #

这是最可靠的解决方式：

• 将包含500字重的字体文件（例如Roboto-Medium.ttf、Inter-Medium.ttf）放到项目的assets/fonts目录下
• 新建或修改项目根目录的react-native.config.js：

  module.exports = {
    assets: ['./assets/fonts/'],
  };
  

• 执行命令链接字体资源：

  npx react-native-asset
  

• 在样式中直接使用该字体（无需额外设置fontWeight，因为字体文件本身就是500字重）：

  {
    fontFamily: 'Roboto-Medium'
  }
  

2. 平台针对性调整 #

• iOS：系统默认的San Francisco字体支持多字重，尝试使用数字格式的字重值（fontWeight: 500）而非字符串，部分场景下数字格式兼容性更好。
• Android：默认Roboto字体的字重映射是normal=400、bold=700，没有原生500字重。除了引入自定义字体，也可以通过微调文字阴影模拟近似效果（仅作应急方案）：

  {
    textShadowOffset: { width: 0.2, height: 0 },
    textShadowRadius: 0.2,
    textShadowColor: '#00000033'
  }
  

3. 排查样式优先级冲突 #

检查是否有父组件样式、内联样式或全局样式覆盖了当前的fontWeight设置，确保目标样式的优先级最高。

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