React Native使用graphql-tag报Object is not a function错误如何解决

该报错核心是graphql-tag 3.0及以上版本调整了导出规则，原默认导入语法不再生效，才会触发_graphqlTag.default不是函数的错误。后续两个Invariant Violation: Module AppRegistry报错是前者触发的连带应用初始化失败问题，修复导入错误后会自动消失，无需单独处理。

排查步骤 #

• 首先确认项目安装的graphql-tag版本，执行命令npm list graphql-tag或yarn list graphql-tag查看版本号，若版本≥3.0.0则属于导入语法不匹配问题。
• 排除多版本依赖冲突：检查是否同时安装了多个版本的graphql或graphql-tag，可删除node_modules文件夹和lock文件（package-lock.json/yarn.lock）后重新安装依赖测试。

解决方法 #

方案1：适配高版本导入规则 #

如果使用的是3.0及以上版本的graphql-tag，将原有导入代码

import gql from "graphql-tag";

修改为命名导入语法即可：

import { gql } from "graphql-tag";

如果使用commonJS的require写法，对应调整为const { gql } = require('graphql-tag');

方案2：回退到支持默认导入的版本 #

如果希望继续使用原有默认导入语法，可将graphql-tag回退到最后一个支持默认导出的2.x版本，执行命令：

# npm用户执行
npm install graphql-tag@2.12.6
# yarn用户执行
yarn add graphql-tag@2.12.6

修改完成后清空React Native构建缓存重新运行即可生效：

npx react-native start --reset-cache

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