【亲测免费】 React Native 地理定位库(@react-native-community/react-native-geolocation)教程

1. 项目目录结构及介绍

在@react-native-community/react-native-geolocation项目中，主要的目录和文件包括：

• android: 安卓平台相关的源代码和配置。
• example: 示例应用程序的源码，展示如何使用这个库。
• ios: iOS平台的相关源代码和配置。
• js: 包含JavaScript接口的主要代码库。
• .github: GitHub相关设置和工作流文件。
• README.md: 项目的基本说明文档。
• package.json: 项目依赖和元数据定义。
• podspec: iOS的CocoaPods配置文件。
• tsconfig.*: TypeScript编译配置。
• yarn.lock: Yarn的依赖锁定文件。

这些文件和目录共同构成了一个可以在React Native应用中使用的地理定位API。

2. 项目的启动文件介绍

尽管这个库自身并不提供一个可运行的应用程序，但它的example目录中有一个示例项目，可以用来了解如何在React Native应用中集成和使用它。在示例项目中，关键的启动文件有：

• index.js: 这是React Native应用的入口点，通常在这里导入和初始化React组件树。
• App.js: 示例应用的主要组件，展示了如何调用Geolocation模块的方法。

要运行示例项目，你需要先安装所有依赖，然后分别在iOS或Android模拟器/设备上启动：

cd example
npm install 或者 yarn
npx react-native run-ios 或 npx react-native run-android

3. 项目的配置文件介绍

android/app/build.gradle

在这个文件里，你需要添加对@react-native-community/geolocation的依赖：

dependencies {
    // ...
    implementation project(':react-native-community-geolocation')
}

android/app/src/main/java/your_package_name/MainApplication.java

在此文件中，你需要导入并注册GeolocationPackage：

import com.reactnativecommunity.geolocation.GeolocationPackage; // 导入包

// ...

@Override
protected List<ReactPackage> getPackages() {
    List<ReactPackage> packages = new PackageList(this).getPackages();
    // 添加GeolocationPackage
    packages.add(new GeolocationPackage());
    return packages;
}

metro.config.js

默认情况下，如果使用了metro.config.js，你可能不需要对这个库进行特别配置。然而，如果你的项目有自定义的打包规则，确保此库中的文件可以正确解析。

package.json

在你的主项目中，通过以下命令安装@react-native-community/geolocation：

npm install @react-native-community/geolocation 或 yarn add @react-native-community/geolocation

然后，在package.json中，你会看到这个库作为依赖项被添加。

以上就是@react-native-community/react-native-geolocation项目的关键组件及其用途。记得根据你的项目需求调整配置，并遵循官方文档以获取最新的集成指南。