react-native-maps iOS 使用 use_frameworks 时出现构建问题! :链接=>:静态
react-native-maps iOS build issues when using use_frameworks! :linkage => :static
主要错误:GMUHeatmapTileLayer.h not found
和
GMUKMLParser.h
未找到。
这是我的 Podfile 的样子:
source 'https://github.com/CocoaPods/Specs.git'
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
install! 'cocoapods', :deterministic_uuids => false
platform :ios, '10.0'
target 'myProject' do
rn_maps_path = '../node_modules/react-native-maps';
pod 'react-native-google-maps', path: rn_maps_path
pod 'GoogleMaps'
pod 'GooglePlaces'
pod 'Google-Maps-iOS-Utils',
config = use_native_modules!
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => false
)
pod 'react-native-document-picker', :path => '../node_modules/react-native-document-picker'
pod 'Google-Mobile-Ads-SDK', '~> 7.69.0'
pod 'GoogleSignIn', '~> 5.0.0'
pod 'RNPhotoEditor', :path => '../node_modules/react-native-photo-editor/ios'
use_frameworks! :linkage => :static
pod 'iOSPhotoEditor', :git => 'https://github.com/prscX/photo-editor', :branch => 'master'
post_install do |installer|
installer.pods_project.targets.each do |target|
if target.name.include?('iOSPhotoEditor')
target.build_configurations.each do |config|
config.build_settings['SWIFT_VERSION'] = '5'
end
end
target.build_configurations.each do |config|
config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
end
if target.name == 'react-native-google-maps'
target.build_configurations.each do |config|
config.build_settings['CLANG_ENABLE_MODULES'] = 'No'
end
end
if (target.name&.eql?('FBReactNativeSpec'))
target.build_phases.each do |build_phase|
if (build_phase.respond_to?(:name) && build_phase.name.eql?('[CP-User] Generate Specs'))
target.build_phases.move(build_phase, 0)
end
end
end
end
end
# Follow [Flipper iOS Setup Guidelines][https://fbflipper.com/docs/getting-started/ios-native/]
# This is required because iOSPhotoEditor is implementated using Swift
$static_framework = ['FlipperKit', 'Flipper', 'Flipper-Folly',
'CocoaAsyncSocket', 'ComponentKit', 'Flipper-DoubleConversion',
'Flipper-Glog', 'Flipper-PeerTalk', 'Flipper-RSocket', 'Yoga', 'YogaKit',
'CocoaLibEvent', 'OpenSSL-Universal', 'boost-for-react-native']
pre_install do |installer|
Pod::Installer::Xcode::TargetValidator.send(:define_method, :verify_no_static_framework_transitive_dependencies) {}
installer.pod_targets.each do |pod|
if $static_framework.include?(pod.name)
def pod.build_type;
Pod::BuildType.static_library
end
end
end
end
end
为 react-native-photo-editor
添加需要 use_frameworks! :linkage => :static
的代码后
react-native-maps
找不到 google-maps-ios-utils
个文件。
GMUHeatmapTileLayer.h file not found
我已尝试手动添加 google-maps-ios-utils
,如下所述:
但 AirGoogleMaps
个文件仍然无法访问这些文件:
部门:
RN: 0.64.0
react-native-maps: 0.28
Google-Maps-iOS-Utils: 2.1.0
GoogleMaps: 3.5.0
有没有人成功地将 react-native-maps
与 google 地图和 use_frameworks!
一起使用?
我的 pod 文件有问题吗?
我怎样才能让这个 Google-Maps-iOS-Utils: 2.1.0
工作?
有没有人采取一些步骤来手动添加此库并使其在 RN 0.64 中使用桥接 header 与上述 use_frameworks 构建?
我也尝试了这个答案中的所有步骤,但出现了与打印屏幕图像相同的错误。
https://github.com/react-native-maps/react-native-maps/issues/3536#issuecomment-683563649
有关 node_modules 部门的更多信息:
"dependencies": {
"@react-native-async-storage/async-storage": "1.14.1",
"@react-native-community/geolocation": "2.0.2",
"@react-native-community/google-signin": "5.0.0",
"@react-native-community/hooks": "2.6.0",
"@react-native-community/image-editor": "2.3.0",
"@react-native-community/netinfo": "6.0.0",
"@sentry/browser": "6.2.3",
"@sentry/react-native": "2.4.0",
"@svgr/webpack": "4.2.0",
"@xobotyi/scrollbar-width": "1.9.5",
"abortcontroller-polyfill": "1.7.1",
"bfj": "6.1.1",
"case-sensitive-paths-webpack-plugin": "2.2.0",
"color": "3.1.3",
"cross-fetch": "3.1.2",
"css-loader": "1.0.1",
"dotenv": "6.2.0",
"dotenv-expand": "4.2.0",
"file-loader": "2.0.0",
"html-webpack-plugin": "4.0.0-beta.4",
"leaflet": "1.7.1",
"lokijs": "1.5.11",
"mini-css-extract-plugin": "0.4.4",
"optimize-css-assets-webpack-plugin": "5.0.1",
"pnp-webpack-plugin": "1.2.1",
"postcss-flexbugs-fixes": "4.1.0",
"postcss-loader": "3.0.0",
"postcss-preset-env": "6.5.0",
"postcss-safe-parser": "4.0.1",
"query-string": "6.6.0",
"react": "17.0.1",
"react-dev-utils": "10.2.1",
"react-dom": "17.0.1",
"react-leaflet": "3.1.0",
"react-native": "0.64.0",
"react-native-admob": "2.0.0-beta.6",
"react-native-device-info": "8.0.7",
"react-native-document-picker": "5.0.2",
"react-native-fs": "2.16.6",
"react-native-google-places-autocomplete": "2.2.0",
"react-native-image-crop-picker": "0.36.0",
"react-native-image-size": "1.1.3",
"react-native-local-mongodb": "2.2.9",
"react-native-maps": "0.28.0",
"react-native-photo-editor": "^1.0.10",
"react-native-safe-area-context": "3.2.0",
"react-native-sensitive-info": "5.5.8",
"react-native-splash-screen": "3.2.0",
"react-native-svg": "12.1.0",
"react-native-vector-icons": "8.1.0",
"react-native-web": "0.15.0",
"react-router": "5.1.2",
"react-router-dom": "5.1.2",
"resolve": "1.10.0",
"rn-fetch-blob": "0.12.0",
"sass-loader": "7.1.0",
"style-loader": "0.23.1",
"terser-webpack-plugin": "1.2.3",
"ts-events": "3.4.0",
"typescript": "4.0.5",
"url-loader": "1.1.2",
"uuid": "3.4.0",
"webpack": "4.41.6",
"webpack-dev-server": "3.10.3",
"webpack-manifest-plugin": "2.2.0",
"workbox-webpack-plugin": "3.6.3"
},
"resolutions": {
"typescript": "4.0.5"
},
"devDependencies": {
"@babel/core": "7.12.9",
"@babel/plugin-proposal-class-properties": "7.12.13",
"@babel/plugin-proposal-decorators": "7.12.13",
"@babel/plugin-transform-flow-strip-types": "7.12.13",
"@babel/plugin-transform-runtime": "7.12.15",
"@babel/polyfill": "7.12.1",
"@babel/runtime": "7.12.5",
"@carimus/metro-symlinked-deps": "1.1.0",
"@react-native-community/eslint-config": "2.0.0",
"@typescript-eslint/eslint-plugin": "4.19.0",
"@typescript-eslint/parser": "4.19.0",
"babel-jest": "26.6.3",
"babel-loader": "8.2.2",
"babel-plugin-module-resolver": "4.0.0",
"babel-plugin-named-asset-import": "0.2.3",
"babel-plugin-react-native-web": "0.15.0",
"babel-plugin-transform-remove-console": "6.9.4",
"babel-preset-react-app": "7.0.2",
"eslint": "7.19.0",
"jest": "26.6.3",
"jetifier": "^1.6.6",
"metro-react-native-babel-preset": "0.64.0",
"mockdate": "2.0.5",
"moment-timezone": "0.5.33",
"path-exists": "4.0.0",
"react-error-overlay": "6.0.6",
"react-test-renderer": "17.0.1",
"sftp-sync-deploy": "0.7.1",
"yarn-run-all": "3.1.1"
},
补充说明:
当我添加时构建过程中断(触发新的崩溃与 rn-maps 相关)
https://github.com/prscX/react-native-photo-editor
(需要 use_frameworks
)。
如果我从 Podfile
中删除此模块和与之关联的额外设置,一切正常。
为了能够按照问题中的描述使用 react-native-maps
和 use_frameworks
构建项目,我必须分叉 react-native-maps
库并替换
Google-Maps-iOS-Utils
header 中的 Google_Maps_iOS_Utils
导入
lib/ios/AirGoogleMaps/AIRGoogleMap.m
:
#import <Google_Maps_iOS_Utils/GMUKMLParser.h>
#import <Google_Maps_iOS_Utils/GMUPlacemark.h>
#import <Google_Maps_iOS_Utils/GMUPoint.h>
#import <Google_Maps_iOS_Utils/GMUGeometryRenderer.h>
在lib/ios/AirGoogleMaps/AIRGoogleMapHeatmap.h
中:
#import <Google_Maps_iOS_Utils/GMUHeatmapTileLayer.h>
如果有人知道比这更好的解决方案,我会很乐意接受它,如果在接下来的几天内添加答案,我将授予它问题所附的赏金。
我可能会保留叉子,直到 react-native-maps
更新为更新版本的 google-maps-ios-utils
(在 v3 中,我认为问题已解决)。
"react-native-maps": "https://github.com/fdobre/react-native-maps#hot-fix-use-frameworks-ios",
TL;DR:这里正在 project 构建基本要求(带有用户框架的 react-native-maps 和 react-native-photo-editor)。
添加 AirMaps 和 AirGoogleMaps。
- 右键单击您的项目,然后单击
Add files to <projecjName>
- 转到 ->
node_modules/react-native-maps/lib/ios/
- Select AirMaps 和 AirGoogleMaps
- 确保选项
create groups
和您的目标是 selected。
将 Airmaps 文件夹添加到库搜索路径:
- Goto target->build settings-> search for library search path 并为调试和发布添加以下行(带引号),
"$(PODS_ROOT)/../../node_modules/react-native-maps/lib/ios/AirMaps"
添加google-maps-ios-utils:
根据这些官方instruction
git clone https://github.com/googlemaps/google-maps-ios-utils
在 ios 文件夹上,名称不同。我们只需要 src
文件夹的内容。
在 XCODE 上,右键单击一个项目并创建一个名为 Google-Maps-iOS-Utils
.
的组
右键单击该文件夹,然后单击 Add files to ...
Select 先前克隆的步骤 (i) 目录的 src
目录的所有文件夹。
确保选项已 selected“创建组”并且目标已 selected 作为您的应用程序目标。
删除提到的Google-Maps-iOS-Utils/Heatmap/HeatMapInterpolationPoint.swift file
here。 Select删除时删除引用。
转到项目 -> 构建设置 -> 搜索 preprocessor macros
并为调试和发布添加以下内容。
HAVE_GOOGLE_MAPS=1
HAVE_GOOGLE_MAPS_UTILS=1
重复符号错误
因为我们手动添加了AirGoogleMaps, AirMaps, Google-Maps-iOS-Utils 我们可能会报错:
Error: ld: 658 duplicate symbols for architecture x86_64
解决方案:
- 从
Pods/Pods
pods 部分删除 Google-Maps-iOS-Utils
(select 选项“删除引用”)。因为我们手动添加了 Google-Maps-iOS-Utils
Manually。
如果我们编译我们会得到 ld: 470 duplicate symbols for architecture x86_64
.
- 从
Pods/Development Pods
中删除 react-native-maps
和 react-native-google-maps
(This is the repetitive task)
此处删除的所有 3 个文件夹将重新生成所有内容 pod install
执行。
更新 1:
这是我的 Pod 文件的样子:
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
platform :ios, '10.0'
target 'myAwesomeProject' do
rn_maps_path = '../node_modules/react-native-maps'
pod 'react-native-google-maps', :path => rn_maps_path
config = use_native_modules!
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => false
)
target 'myAwesomeProjectTests' do
inherit! :complete
# Pods for testing
end
# Enables Flipper.
#
# Note that if you have use_frameworks! enabled, Flipper will not work and
# you should disable the next line.
use_flipper!()
pod 'RNPhotoEditor', :path => '../node_modules/react-native-photo-editor/ios'
use_frameworks! :linkage => :static
pod 'iOSPhotoEditor', :git => 'https://github.com/prscX/photo-editor', :branch => 'master'
post_install do |installer|
installer.pods_project.targets.each do |target|
flipper_post_install(installer) # as stated here https://fbflipper.com/docs/getting-started/react-native-ios/#react-native-063
if target.name.include?('iOSPhotoEditor')
target.build_configurations.each do |config|
config.build_settings['SWIFT_VERSION'] = '5'
end
end
if target.name == 'react-native-google-maps'
target.build_configurations.each do |config|
config.build_settings['CLANG_ENABLE_MODULES'] = 'No' # as mentioned here https://github.com/react-native-maps/react-native-maps/issues/3597#issuecomment-745026120
end
end
if (target.name&.eql?('FBReactNativeSpec')) #as mentioned here https://github.com/software-mansion/react-native-screens/issues/842#issuecomment-812543933
target.build_phases.each do |build_phase|
if (build_phase.respond_to?(:name) && build_phase.name.eql?('[CP-User] Generate Specs'))
target.build_phases.move(build_phase, 0)
end
end
end
end
end
$static_framework = ['FlipperKit', 'Flipper', 'Flipper-Folly',
'CocoaAsyncSocket', 'ComponentKit', 'Flipper-DoubleConversion',
'Flipper-Glog', 'Flipper-PeerTalk', 'Flipper-RSocket', 'Yoga', 'YogaKit',
'CocoaLibEvent', 'OpenSSL-Universal', 'boost-for-react-native']
pre_install do |installer|
Pod::Installer::Xcode::TargetValidator.send(:define_method, :verify_no_static_framework_transitive_dependencies) {}
installer.pod_targets.each do |pod|
if $static_framework.include?(pod.name)
def pod.build_type;
Pod::BuildType.static_library
end
end
end
end
# post_install do |installer|
# react_native_post_install(installer)
# end
end
更新 2:
如果以上回答未能解决您的问题。请按照我的 GitHub repo 上的说明逐步进行。
更新 3:
错误:'Google-Maps-iOs-Utils/GMUKMLParser.h' 找不到文件
解决方案:
react-native-maps官方指南says to follow this instructions on google-maps-ios-utils/Swift.md
. However these instructions are vague. Here是比较清晰的说明集:
我们已经在上面克隆并添加了 google-maps-ios-utils。如果您还没有,请按照这些说明进行操作。
创建Swift桥接头
- 文件 > 新建 > 文件 > 头文件
- 通常名称是[项目名称]-Bridging-Header.h,但您可以随意命名。我在这个项目中只命名它
Header.h
因为它真的是一个简单的项目。
- 转到目标->构建设置->搜索
Swift Compiler - General
- 在
Objective-C Bridging Header
中放入Header.h
.
将以下行放在头文件中:
#import "GMUMarkerClustering.h"
#import "GMUGeoJSONParser.h"
#import "GMUKMLParser.h"
#import "GMUGeometryRenderer.h"
将以下行放入 Google-Maps-iOS-Utils/Clustering/GMUMarkerClustering.h
#import "GMUCluster.h"
#import "GMUClusterItem.h"
#import "GMUClusterManager.h"
#import "GMUDefaultClusterIconGenerator.h"
#import "GMUDefaultClusterRenderer.h"
#import "GMUGridBasedClusterAlgorithm.h"
#import "GMUNonHierarchicalDistanceBasedAlgorithm.h"
#import "GMUStaticCluster.h"
#import "GQTPointQuadTree.h"
(This is a repetitive task. you need to do this step every time "yarn install" executes)
更改为 AirGoogleMaps/AIRGoogleMapHeatmap.h
文件中的 #import "GMUHeatmapTileLayer.h"
导入语句。
(This is a repetitive task. you need to do this step every time "yarn install" executes)
将以下行放入 AirGoogleMaps/AIRGoogleMap.m
#import "GMUKMLParser.h"
#import "GMUPlacemark.h"
#import "GMUPoint.h"
#import "GMUGeometryRenderer.h"
更新 4:
在评论中,@Florin 提到了一个错误
Build input files cannot be found: '/ios/master/src/GeometryUtils/Internal/CatesianPoint.swift'...'
这是因为我不知道如何在git中使用子模块。因此,当克隆 google-maps-ios-utils 时,该回购不会被推送到我的 GitHub 回购(在此答案的第一行中提到)。该问题已解决。我刚刚添加了 ```src`` 文件夹内容,而没有在我的存储库中克隆整个存储库并推送更改。
主要错误:GMUHeatmapTileLayer.h not found
和
GMUKMLParser.h
未找到。
这是我的 Podfile 的样子:
source 'https://github.com/CocoaPods/Specs.git'
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
install! 'cocoapods', :deterministic_uuids => false
platform :ios, '10.0'
target 'myProject' do
rn_maps_path = '../node_modules/react-native-maps';
pod 'react-native-google-maps', path: rn_maps_path
pod 'GoogleMaps'
pod 'GooglePlaces'
pod 'Google-Maps-iOS-Utils',
config = use_native_modules!
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => false
)
pod 'react-native-document-picker', :path => '../node_modules/react-native-document-picker'
pod 'Google-Mobile-Ads-SDK', '~> 7.69.0'
pod 'GoogleSignIn', '~> 5.0.0'
pod 'RNPhotoEditor', :path => '../node_modules/react-native-photo-editor/ios'
use_frameworks! :linkage => :static
pod 'iOSPhotoEditor', :git => 'https://github.com/prscX/photo-editor', :branch => 'master'
post_install do |installer|
installer.pods_project.targets.each do |target|
if target.name.include?('iOSPhotoEditor')
target.build_configurations.each do |config|
config.build_settings['SWIFT_VERSION'] = '5'
end
end
target.build_configurations.each do |config|
config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
end
if target.name == 'react-native-google-maps'
target.build_configurations.each do |config|
config.build_settings['CLANG_ENABLE_MODULES'] = 'No'
end
end
if (target.name&.eql?('FBReactNativeSpec'))
target.build_phases.each do |build_phase|
if (build_phase.respond_to?(:name) && build_phase.name.eql?('[CP-User] Generate Specs'))
target.build_phases.move(build_phase, 0)
end
end
end
end
end
# Follow [Flipper iOS Setup Guidelines][https://fbflipper.com/docs/getting-started/ios-native/]
# This is required because iOSPhotoEditor is implementated using Swift
$static_framework = ['FlipperKit', 'Flipper', 'Flipper-Folly',
'CocoaAsyncSocket', 'ComponentKit', 'Flipper-DoubleConversion',
'Flipper-Glog', 'Flipper-PeerTalk', 'Flipper-RSocket', 'Yoga', 'YogaKit',
'CocoaLibEvent', 'OpenSSL-Universal', 'boost-for-react-native']
pre_install do |installer|
Pod::Installer::Xcode::TargetValidator.send(:define_method, :verify_no_static_framework_transitive_dependencies) {}
installer.pod_targets.each do |pod|
if $static_framework.include?(pod.name)
def pod.build_type;
Pod::BuildType.static_library
end
end
end
end
end
为 react-native-photo-editor
添加需要 use_frameworks! :linkage => :static
react-native-maps
找不到 google-maps-ios-utils
个文件。
GMUHeatmapTileLayer.h file not found
我已尝试手动添加 google-maps-ios-utils
,如下所述:
但 AirGoogleMaps
个文件仍然无法访问这些文件:
部门:
RN: 0.64.0
react-native-maps: 0.28
Google-Maps-iOS-Utils: 2.1.0
GoogleMaps: 3.5.0
有没有人成功地将 react-native-maps
与 google 地图和 use_frameworks!
一起使用?
我的 pod 文件有问题吗?
我怎样才能让这个 Google-Maps-iOS-Utils: 2.1.0
工作?
有没有人采取一些步骤来手动添加此库并使其在 RN 0.64 中使用桥接 header 与上述 use_frameworks 构建?
我也尝试了这个答案中的所有步骤,但出现了与打印屏幕图像相同的错误。
https://github.com/react-native-maps/react-native-maps/issues/3536#issuecomment-683563649
有关 node_modules 部门的更多信息:
"dependencies": {
"@react-native-async-storage/async-storage": "1.14.1",
"@react-native-community/geolocation": "2.0.2",
"@react-native-community/google-signin": "5.0.0",
"@react-native-community/hooks": "2.6.0",
"@react-native-community/image-editor": "2.3.0",
"@react-native-community/netinfo": "6.0.0",
"@sentry/browser": "6.2.3",
"@sentry/react-native": "2.4.0",
"@svgr/webpack": "4.2.0",
"@xobotyi/scrollbar-width": "1.9.5",
"abortcontroller-polyfill": "1.7.1",
"bfj": "6.1.1",
"case-sensitive-paths-webpack-plugin": "2.2.0",
"color": "3.1.3",
"cross-fetch": "3.1.2",
"css-loader": "1.0.1",
"dotenv": "6.2.0",
"dotenv-expand": "4.2.0",
"file-loader": "2.0.0",
"html-webpack-plugin": "4.0.0-beta.4",
"leaflet": "1.7.1",
"lokijs": "1.5.11",
"mini-css-extract-plugin": "0.4.4",
"optimize-css-assets-webpack-plugin": "5.0.1",
"pnp-webpack-plugin": "1.2.1",
"postcss-flexbugs-fixes": "4.1.0",
"postcss-loader": "3.0.0",
"postcss-preset-env": "6.5.0",
"postcss-safe-parser": "4.0.1",
"query-string": "6.6.0",
"react": "17.0.1",
"react-dev-utils": "10.2.1",
"react-dom": "17.0.1",
"react-leaflet": "3.1.0",
"react-native": "0.64.0",
"react-native-admob": "2.0.0-beta.6",
"react-native-device-info": "8.0.7",
"react-native-document-picker": "5.0.2",
"react-native-fs": "2.16.6",
"react-native-google-places-autocomplete": "2.2.0",
"react-native-image-crop-picker": "0.36.0",
"react-native-image-size": "1.1.3",
"react-native-local-mongodb": "2.2.9",
"react-native-maps": "0.28.0",
"react-native-photo-editor": "^1.0.10",
"react-native-safe-area-context": "3.2.0",
"react-native-sensitive-info": "5.5.8",
"react-native-splash-screen": "3.2.0",
"react-native-svg": "12.1.0",
"react-native-vector-icons": "8.1.0",
"react-native-web": "0.15.0",
"react-router": "5.1.2",
"react-router-dom": "5.1.2",
"resolve": "1.10.0",
"rn-fetch-blob": "0.12.0",
"sass-loader": "7.1.0",
"style-loader": "0.23.1",
"terser-webpack-plugin": "1.2.3",
"ts-events": "3.4.0",
"typescript": "4.0.5",
"url-loader": "1.1.2",
"uuid": "3.4.0",
"webpack": "4.41.6",
"webpack-dev-server": "3.10.3",
"webpack-manifest-plugin": "2.2.0",
"workbox-webpack-plugin": "3.6.3"
},
"resolutions": {
"typescript": "4.0.5"
},
"devDependencies": {
"@babel/core": "7.12.9",
"@babel/plugin-proposal-class-properties": "7.12.13",
"@babel/plugin-proposal-decorators": "7.12.13",
"@babel/plugin-transform-flow-strip-types": "7.12.13",
"@babel/plugin-transform-runtime": "7.12.15",
"@babel/polyfill": "7.12.1",
"@babel/runtime": "7.12.5",
"@carimus/metro-symlinked-deps": "1.1.0",
"@react-native-community/eslint-config": "2.0.0",
"@typescript-eslint/eslint-plugin": "4.19.0",
"@typescript-eslint/parser": "4.19.0",
"babel-jest": "26.6.3",
"babel-loader": "8.2.2",
"babel-plugin-module-resolver": "4.0.0",
"babel-plugin-named-asset-import": "0.2.3",
"babel-plugin-react-native-web": "0.15.0",
"babel-plugin-transform-remove-console": "6.9.4",
"babel-preset-react-app": "7.0.2",
"eslint": "7.19.0",
"jest": "26.6.3",
"jetifier": "^1.6.6",
"metro-react-native-babel-preset": "0.64.0",
"mockdate": "2.0.5",
"moment-timezone": "0.5.33",
"path-exists": "4.0.0",
"react-error-overlay": "6.0.6",
"react-test-renderer": "17.0.1",
"sftp-sync-deploy": "0.7.1",
"yarn-run-all": "3.1.1"
},
补充说明:
当我添加时构建过程中断(触发新的崩溃与 rn-maps 相关)
https://github.com/prscX/react-native-photo-editor
(需要 use_frameworks
)。
如果我从 Podfile
中删除此模块和与之关联的额外设置,一切正常。
为了能够按照问题中的描述使用 react-native-maps
和 use_frameworks
构建项目,我必须分叉 react-native-maps
库并替换
Google-Maps-iOS-Utils
header 中的 Google_Maps_iOS_Utils
导入
lib/ios/AirGoogleMaps/AIRGoogleMap.m
:
#import <Google_Maps_iOS_Utils/GMUKMLParser.h>
#import <Google_Maps_iOS_Utils/GMUPlacemark.h>
#import <Google_Maps_iOS_Utils/GMUPoint.h>
#import <Google_Maps_iOS_Utils/GMUGeometryRenderer.h>
在lib/ios/AirGoogleMaps/AIRGoogleMapHeatmap.h
中:
#import <Google_Maps_iOS_Utils/GMUHeatmapTileLayer.h>
如果有人知道比这更好的解决方案,我会很乐意接受它,如果在接下来的几天内添加答案,我将授予它问题所附的赏金。
我可能会保留叉子,直到 react-native-maps
更新为更新版本的 google-maps-ios-utils
(在 v3 中,我认为问题已解决)。
"react-native-maps": "https://github.com/fdobre/react-native-maps#hot-fix-use-frameworks-ios",
添加 AirMaps 和 AirGoogleMaps。
- 右键单击您的项目,然后单击
Add files to <projecjName>
- 转到 ->
node_modules/react-native-maps/lib/ios/
- Select AirMaps 和 AirGoogleMaps
- 确保选项
create groups
和您的目标是 selected。
将 Airmaps 文件夹添加到库搜索路径:
- Goto target->build settings-> search for library search path 并为调试和发布添加以下行(带引号),
"$(PODS_ROOT)/../../node_modules/react-native-maps/lib/ios/AirMaps"
添加google-maps-ios-utils:
根据这些官方instruction
git clone https://github.com/googlemaps/google-maps-ios-utils
在 ios 文件夹上,名称不同。我们只需要src
文件夹的内容。在 XCODE 上,右键单击一个项目并创建一个名为
的组Google-Maps-iOS-Utils
.右键单击该文件夹,然后单击
Add files to ...
Select 先前克隆的步骤 (i) 目录的
src
目录的所有文件夹。确保选项已 selected“创建组”并且目标已 selected 作为您的应用程序目标。
删除提到的
Google-Maps-iOS-Utils/Heatmap/HeatMapInterpolationPoint.swift file
here。 Select删除时删除引用。转到项目 -> 构建设置 -> 搜索
preprocessor macros
并为调试和发布添加以下内容。HAVE_GOOGLE_MAPS=1
HAVE_GOOGLE_MAPS_UTILS=1
重复符号错误
因为我们手动添加了AirGoogleMaps, AirMaps, Google-Maps-iOS-Utils 我们可能会报错:
Error: ld: 658 duplicate symbols for architecture x86_64
解决方案:
- 从
Pods/Pods
pods 部分删除Google-Maps-iOS-Utils
(select 选项“删除引用”)。因为我们手动添加了Google-Maps-iOS-Utils
Manually。
如果我们编译我们会得到 ld: 470 duplicate symbols for architecture x86_64
.
- 从
Pods/Development Pods
中删除react-native-maps
和react-native-google-maps
(This is the repetitive task)
此处删除的所有 3 个文件夹将重新生成所有内容 pod install
执行。
更新 1:
这是我的 Pod 文件的样子:
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
platform :ios, '10.0'
target 'myAwesomeProject' do
rn_maps_path = '../node_modules/react-native-maps'
pod 'react-native-google-maps', :path => rn_maps_path
config = use_native_modules!
use_react_native!(
:path => config[:reactNativePath],
# to enable hermes on iOS, change `false` to `true` and then install pods
:hermes_enabled => false
)
target 'myAwesomeProjectTests' do
inherit! :complete
# Pods for testing
end
# Enables Flipper.
#
# Note that if you have use_frameworks! enabled, Flipper will not work and
# you should disable the next line.
use_flipper!()
pod 'RNPhotoEditor', :path => '../node_modules/react-native-photo-editor/ios'
use_frameworks! :linkage => :static
pod 'iOSPhotoEditor', :git => 'https://github.com/prscX/photo-editor', :branch => 'master'
post_install do |installer|
installer.pods_project.targets.each do |target|
flipper_post_install(installer) # as stated here https://fbflipper.com/docs/getting-started/react-native-ios/#react-native-063
if target.name.include?('iOSPhotoEditor')
target.build_configurations.each do |config|
config.build_settings['SWIFT_VERSION'] = '5'
end
end
if target.name == 'react-native-google-maps'
target.build_configurations.each do |config|
config.build_settings['CLANG_ENABLE_MODULES'] = 'No' # as mentioned here https://github.com/react-native-maps/react-native-maps/issues/3597#issuecomment-745026120
end
end
if (target.name&.eql?('FBReactNativeSpec')) #as mentioned here https://github.com/software-mansion/react-native-screens/issues/842#issuecomment-812543933
target.build_phases.each do |build_phase|
if (build_phase.respond_to?(:name) && build_phase.name.eql?('[CP-User] Generate Specs'))
target.build_phases.move(build_phase, 0)
end
end
end
end
end
$static_framework = ['FlipperKit', 'Flipper', 'Flipper-Folly',
'CocoaAsyncSocket', 'ComponentKit', 'Flipper-DoubleConversion',
'Flipper-Glog', 'Flipper-PeerTalk', 'Flipper-RSocket', 'Yoga', 'YogaKit',
'CocoaLibEvent', 'OpenSSL-Universal', 'boost-for-react-native']
pre_install do |installer|
Pod::Installer::Xcode::TargetValidator.send(:define_method, :verify_no_static_framework_transitive_dependencies) {}
installer.pod_targets.each do |pod|
if $static_framework.include?(pod.name)
def pod.build_type;
Pod::BuildType.static_library
end
end
end
end
# post_install do |installer|
# react_native_post_install(installer)
# end
end
更新 2:
如果以上回答未能解决您的问题。请按照我的 GitHub repo 上的说明逐步进行。
更新 3:
错误:'Google-Maps-iOs-Utils/GMUKMLParser.h' 找不到文件react-native-maps官方指南says to follow this instructions on google-maps-ios-utils/Swift.md
. However these instructions are vague. Here是比较清晰的说明集:
我们已经在上面克隆并添加了 google-maps-ios-utils。如果您还没有,请按照这些说明进行操作。
创建Swift桥接头
- 文件 > 新建 > 文件 > 头文件
- 通常名称是[项目名称]-Bridging-Header.h,但您可以随意命名。我在这个项目中只命名它
Header.h
因为它真的是一个简单的项目。 - 转到目标->构建设置->搜索
Swift Compiler - General
- 在
Objective-C Bridging Header
中放入Header.h
.
- 在
将以下行放在头文件中:
#import "GMUMarkerClustering.h" #import "GMUGeoJSONParser.h" #import "GMUKMLParser.h" #import "GMUGeometryRenderer.h"
将以下行放入
Google-Maps-iOS-Utils/Clustering/GMUMarkerClustering.h
#import "GMUCluster.h" #import "GMUClusterItem.h" #import "GMUClusterManager.h" #import "GMUDefaultClusterIconGenerator.h" #import "GMUDefaultClusterRenderer.h" #import "GMUGridBasedClusterAlgorithm.h" #import "GMUNonHierarchicalDistanceBasedAlgorithm.h" #import "GMUStaticCluster.h" #import "GQTPointQuadTree.h"
(This is a repetitive task. you need to do this step every time "yarn install" executes)
更改为AirGoogleMaps/AIRGoogleMapHeatmap.h
文件中的#import "GMUHeatmapTileLayer.h"
导入语句。(This is a repetitive task. you need to do this step every time "yarn install" executes)
将以下行放入AirGoogleMaps/AIRGoogleMap.m
#import "GMUKMLParser.h" #import "GMUPlacemark.h" #import "GMUPoint.h" #import "GMUGeometryRenderer.h"
更新 4:
在评论中,@Florin 提到了一个错误
Build input files cannot be found: '/ios/master/src/GeometryUtils/Internal/CatesianPoint.swift'...'
这是因为我不知道如何在git中使用子模块。因此,当克隆 google-maps-ios-utils 时,该回购不会被推送到我的 GitHub 回购(在此答案的第一行中提到)。该问题已解决。我刚刚添加了 ```src`` 文件夹内容,而没有在我的存储库中克隆整个存储库并推送更改。