# 설치

## 요구사항 <a href="#requirements" id="requirements"></a>

* **React Native** 버전 0.71.8이상
* **Android**: API 버전 <mark style="color:blue;">**24**</mark>이상
* **iOS**: 버전 <mark style="color:blue;">**13.0**</mark> 이상

{% hint style="info" %}
해당 패키지는  **Android**, **iOS** 환경에서만 사용 가능합니다. **Web**, **MacOS**, **Window**, **Linux** 환경에서는 사용할 수 없습니다.&#x20;
{% endhint %}

{% hint style="warning" %}
New Architecture는 아직 지원되지 않습니다
{% endhint %}

## 설치하기 <a href="#installation" id="installation"></a>

npm 패키지로 설치할 수 있습니다.

{% tabs %}
{% tab title="npm" %}

```bash
npm install @wepin/sdk-rn
```

{% endtab %}

{% tab title="yarn" %}

```bash
npm install @wepin/sdk-rn
```

{% endtab %}
{% endtabs %}

### peerDependencies

{% tabs %}
{% tab title="npm" %}

```bash
npm install react-native-device-info

# for ios
cd ios
pod install
```

{% endtab %}

{% tab title="yarn" %}

```bash
yarn add react-native-device-info

# for ios
cd ios
pod install
```

{% endtab %}
{% endtabs %}

### 설정하기

OAuth 로그인 기능을 활성화하려면 **딥 링크 스킴(Deep Link Scheme)** 을 구성해야 합니다.\
**딥 링크 스킴 형식(Deep Link scheme format) :** `wepin. + Your Wepin App ID`

#### Android

`build.gradle (app)` 파일에서 `manifestPlaceholders`를 추가하여 Wepin Widget SDK가 이 커스텀 스킴을 통한 모든 리디렉션을 쉽게 캡처할 수 있도록 설정합니다.

```
// For Deep Link => RedirectScheme Format : wepin. + Wepin App ID
android.defaultConfig.manifestPlaceholders = [
  'appAuthRedirectScheme': 'wepin.{{YOUR_WEPIN_APPID}}'
]
```

#### iOS

인증 프로세스 후 앱으로 다시 리디렉션하기 위해 앱의 URL 스킴을 `Info.plist` 파일에 추가해야 합니다.&#x20;

```
<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLSchemes</key>
        <string>Editor</string>
        <key>CFBundleURLName</key>
        <string>unique name</string>
        <array>
            <string>wepin + your Wepin app id</string>
        </array>
    </dict>
</array>
```

#### iOS Podfile 설정

Xcode 26.0.1 이상 버전 사용 시 빌드 에러가 발생할 수 있습니다.

> error Unable to find module dependency: 'bcrypt' (in tarrget 'WepinLogin' from project 'Pods')

위와 같은 에러가 발생하는 경우 Podfile 에 아래 코드를 추가해주세요.

```
post_install do |installer| 
  installer.pods_project.targets.each do |target| 
    target.build_configurations.each do |config| 
      config.build_settings['SWIFT_ENABLE_EXPLICIT_MODULES'] = 'NO' 
    end 
  end 
end
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wepin.io/widget-integration/react-native-sdk/widget/installation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.