使用Relay Compiler时GraphQL多接口实现的Schema编译失败问题

我之前也碰到过Relay 1.5.0这个版本的坑！当Schema里的类型实现多个接口时编译失败，其实是这个旧版本的已知bug，咱们一步步来解决：

问题原因 #

Relay Compiler 1.5.0对GraphQL中一个类型实现多个接口的场景支持存在缺陷，官方在后续的版本（比如v1.7.0及以上）修复了这个问题。

解决方案 #

方案1：升级Relay版本（推荐） #

这是最彻底的解决办法，把react-relay和relay-compiler都升级到至少v1.7.0版本，修改你的package.json配置如下：

{
  "scripts": {
    "relay": "relay-compiler --src ./ --schema schema.graphqls"
  },
  "dependencies": {
    "react-relay": "^1.7.0"
  },
  "devDependencies": {
    "relay-compiler": "^1.7.0"
  }
}

然后执行安装命令更新依赖：

npm install
# 或者用yarn
yarn install

更新完成后重新运行编译命令：

npm run relay

此时应该就能正常完成编译了。

方案2：临时兼容（不推荐，仅用于无法升级的场景） #

如果因为项目依赖限制无法升级版本，可以临时在类型定义中显式重复接口的字段（虽然GraphQL允许这种冗余写法，但会增加维护成本），修改你的schema.graphqls：

interface First { a: String }
interface Second { b: String }
type Something implements First, Second { 
  a: String 
  b: String
}

这种写法能让旧版本的Relay Compiler正确解析类型字段，完成编译，但长期来看还是建议升级版本。

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