ReactNative 引用第三方地图插件react-native-baidumap-sdk遇到的一些坑解决方法
引入百度地图的包首先要去百度申请AK,具体申请方式可以才考百度官方文档:http://lbsyun.baidu.com/index.php?title=androidsdk/guide/create-project/ak
安卓配置:
需要注意的是开发版本的SHA1是从电脑的全局配置文件.android获取,记得不要找错了位置。
发布版本的SHA1对应你的apk发布签名。如何拿到SHA1,在百度官方文档里面有说明就一个命令:
调试版本使用指令:keytool -list -v -keystore debug.keystore
发布版本请使用指令:keytool -list -v -keystore apk 的 keystore
苹果配置:http://lbsyun.baidu.com/index.php?title=iossdk/guide/create-project/ak
现在,我们开始安装react-native-baidumap-sdk,具体的安装使用方法可以参考GitHub的react-native-baidumap-sdk官方说明:https://github.com/qiuxiang/react-native-baidumap-sdk/blob/master/docs/installation.md
引入项目
npm i react-native-baidumap-sdk
或
yarn add react-native-baidumap-sdk
配置
Android
react-native link react-native-baidumap-sdk
在 AndroidManifest 中添加获取 的Android 开发**:
<application> <meta-data android:name="com.baidu.lbsapi.API_KEY" android:value="开发**" /> </application>
下面是比较需要注意的IOS添加
iOS
暂时只提供 cocoapods 配置方式,手动配置请参考官方文档。
下面的中文部分是我的踩坑记录,各位在创建Podfile的时候要记得去掉中文部分
在 ios
目录下新建文件 Podfile
:
创建Podfile的方法有很多,各位可以自行了解。我比较喜欢使用的命令:touch Podfile。然后open Podfile打开文件,然后把下面的命令复制进来这个Podfile
# 注意ios的版本,比较重要,这是你的项目能兼容的ios最低版本。我之前一直没办法pod install就是因为版本的问题。后续补上截图 # 注意下面命令在官网部分因为版本更新,GLog记得要改回小写的glog,不然会有报错。 # Uncomment the next line to define a global platform for your project platform :ios, '9.0' # The target name is most likely the name of your project. 注意点:target ‘你的项目名称’ target 'JSBridgeTest' do # Uncomment the next line if you're using Swift or would like to use dynamic frameworks # use_frameworks! # Pods for NumberTileGame # Your 'node_modules' directory is probably in the root of your project, # but if not, adjust the `:path` accordingly pod 'React', :path => '../node_modules/react-native', :subspecs => [ 'Core', 'CxxBridge', # Include this for RN >= 0.47 'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43 'RCTText', 'RCTNetwork', 'RCTWebSocket', # Needed for debugging 'RCTAnimation', # Needed for FlatList and animations running on native UI thread # Add any other subspecs you want to use in your project ] # Explicitly include Yoga if you are using RN >= 0.42.0 pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga' # Third party deps podspec link pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec' pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec' pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec' pod 'react-native-baidumap-sdk', path: '../node_modules/react-native-baidumap-sdk/lib/ios' end
注意:不同的 RN 版本,Podfile
可能需要稍作调整,具体参考 https://facebook.github.io/react-native/docs/0.52/integration-with-existing-apps.html 。
然后运行:
pod install
如果运行pod install出现:SDK "iphoneos" cannot be located。这是因为解析xcode的路径不正确,可以参考:https://www.jianshu.com/p/c920fd0205fe
执行脚本出现下面的错误:
building arm64...
xcrun -sdk iphoneos clang is unable to create an executable file.
查找原因:
mac$ xcode-select --print-path
/Library/Developer/CommandLineTools
发现是这个Xcode路径判断错误。
mac$ xcodebuild -showsdks
xcode-select: error: tool 'xcodebuild' requires Xcode, but active developer directory '/Library/Developer/CommandLineTools' is a command line tools instance
回想起最近安装了另外两个版本的Xcode,应该是这样导致了路径错误。
mac$ ls /Applications/Xcode
Xcode.app/ Xcode2.app/ Xcode3.app/
解决方法:给Xcode命令行工具指定路径
mac$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer/
完成后,记得要引用一下这个库。如果项目运行是出现下面几个报错,可能就是因为第三方库没有引用到的原因:
library not found for -lDoubleConversion
library not found for -lAFNetworking
我采用了一个比较粗暴的方法,在Link Binary with Libraies 中Add Others 中选择了,把这个库加了进来。
参考链接: