EAS Build环境下react-native-qrcode-svg报错:_qrcode.default.create未定义
问题描述
我刚创建了一个新的React Native Expo应用,依赖配置如下:
{ "name": "qrcode", "version": "1.0.0", "scripts": { "start": "expo start --dev-client", "android": "expo run:android", "ios": "expo run:ios", "web": "expo start --web" }, "dependencies": { "expo": "46.0.0", "expo-dev-client": "~1.3.1", "expo-permissions": "~13.2.0", "expo-splash-screen": "~0.16.2", "expo-status-bar": "~1.4.2", "react": "18.0.0", "react-native": "0.69.6", "react-native-qrcode-svg": "^6.2.0", "react-native-svg": "^13.2.0", "expo-barcode-scanner": "~11.4.0" }, "devDependencies": { "@babel/core": "^7.12.9" }, "private": true }
使用EAS Build而非Expo Go运行应用时,react-native-qrcode-svg包无法正常工作,持续报错:
TypeError: _qrcode.default.create is not a function. (In '_qrcode.default.create(value, { errorCorrectionLevel: errorCorrectionLevel })', '_qrcode.default.create' is undefined)
问题原因及解决办法
可能原因
- 版本兼容性冲突:
react-native-qrcode-svg@6.2.0与当前Expo 46、React Native 0.69.6的环境不兼容,其内部依赖的qrcode库导出方式与当前项目模块解析逻辑不匹配。 - EAS Build依赖解析异常:EAS在构建原生包时,未正确处理
react-native-qrcode-svg的内部依赖链,导致模块导出内容缺失。
解决办法
1. 降级react-native-qrcode-svg至兼容版本
安装适配Expo 46的稳定版本(如5.1.2):
npm install react-native-qrcode-svg@5.1.2 --save # 或使用yarn: yarn add react-native-qrcode-svg@5.1.2
重新执行EAS Build,验证功能是否恢复正常。
2. 替换为Expo官方兼容的二维码生成方案
利用已安装的expo-barcode-scanner内置的二维码生成能力,无需额外依赖:
import { BarCodeScanner } from 'expo-barcode-scanner'; // 在组件中使用 <BarCodeScanner.BarCodeSVG value="需要生成的二维码内容" format={BarCodeScanner.Constants.BarCodeType.qr} width={200} height={200} />
这种方案完全适配Expo环境,避免第三方库的兼容性问题。
3. 手动修复模块导入问题(临时方案)
如果坚持使用当前版本,可修改react-native-qrcode-svg的源码:
- 找到
node_modules/react-native-qrcode-svg/lib/QRCode.js文件 - 将顶部的
import qrcode from 'qrcode'替换为import * as qrcode from 'qrcode' - 重新执行EAS Build
若要持久化该修改,可使用patch-package:
# 安装patch-package npm install patch-package --save-dev # 修改源码后生成补丁 npx patch-package react-native-qrcode-svg
后续依赖更新时,补丁会自动生效。
内容的提问来源于stack exchange,提问作者Alexander Obidiegwu
相关产品推荐
相关产品推荐

