Blog

react-native 개발 도중 프로젝트를 복사하거나 이동하는 경우가 발생하는데, 이 때 폴더를 복사 또는 이동한다.

안드로이드에서는 별다른 오류가 발생하지 않고 잘 빌드가 되는데, iOS는 아래 오류가 발생하면서 빌드가 실패한다.


error: PCH was compiled with module cache path '/aaa/ios/build/ModuleCache/15IKYQ49IXHLP', but the path is currently '/bbb/ios/build/ModuleCache/15IKYQ49IXHLP'

1 error generated.


프로젝트 폴더에서 ios/build/ModuleCache 폴더를 삭제를 한 후 다시 빌드를 시도를 하면 정상적으로 빌드가 진행이 된다.

Comment +0

한동안 손을 안 댄 프로젝트를 수정할 일이 생겼다.

수정을 다하고 빌드를 해서 실행을 할려고 하니 아래와 같은 에러가 발생 하였다.


JS server already running.

Running /Users/asata/Library/Android/sdk/platform-tools/adb -s LGF460L17e67912 reverse tcp:8081 tcp:8081

Building and installing the app on the device (cd android && ./gradlew installDebug...

google-services plugin could not detect any version for com.google.android.gms or com.google.firebase, default version: 9.0.0 will be used.

please apply google-services plugin at the bottom of the build file.


FAILURE: Build failed with an exception.


* What went wrong:

A problem occurred configuring project ':app'.

> A problem occurred configuring project ':react-native-picker'.

   > Could not resolve all dependencies for configuration ':react-native-picker:_debugCompile'.

      > Could not find com.android.support:appcompat-v7:25.3.1.

        Searched in the following locations:

            file:/Users/asata/.m2/repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.pom

            file:/Users/asata/.m2/repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.jar

            https://jcenter.bintray.com/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.pom

            https://jcenter.bintray.com/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.jar

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.pom

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.jar

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.pom

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.jar

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.pom

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/android/support/appcompat-v7/25.3.1/appcompat-v7-25.3.1.jar

        Required by:

            MyGumiMap:react-native-picker:unspecified > com.facebook.react:react-native:0.42.3-atlassian-1

      > Could not find com.android.support:recyclerview-v7:25.3.1.

        Searched in the following locations:

            file:/Users/asata/.m2/repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.pom

            file:/Users/asata/.m2/repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.jar

            https://jcenter.bintray.com/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.pom

            https://jcenter.bintray.com/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.jar

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.pom

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.jar

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.pom

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.jar

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.pom

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/android/support/recyclerview-v7/25.3.1/recyclerview-v7-25.3.1.jar

        Required by:

            MyGumiMap:react-native-picker:unspecified > com.facebook.react:react-native:0.42.3-atlassian-1

      > Could not find com.atlassian.mobile.video:okhttp-ws-compat:3.7.0-atlassian1.

        Searched in the following locations:

            file:/Users/asata/.m2/repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.pom

            file:/Users/asata/.m2/repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.jar

            https://jcenter.bintray.com/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.pom

            https://jcenter.bintray.com/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.jar

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.pom

            file:/Users/asata/Project/ReactNative/MyGumiMap/node_modules/react-native/android/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.jar

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.pom

            file:/Users/asata/Library/Android/sdk/extras/android/m2repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.jar

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.pom

            file:/Users/asata/Library/Android/sdk/extras/google/m2repository/com/atlassian/mobile/video/okhttp-ws-compat/3.7.0-atlassian1/okhttp-ws-compat-3.7.0-atlassian1.jar

        Required by:

            MyGumiMap:react-native-picker:unspecified > com.facebook.react:react-native:0.42.3-atlassian-1


* Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.


BUILD FAILED


Total time: 11.786 secs

Could not install the app on the device, read the error above for details.

Make sure you have an Android emulator running or a device connected and have

set up your Android development environment:

https://facebook.github.io/react-native/docs/android-setup.html


오류가 났다는 노드 모듈에도 별 문제가 없는데도 이런 에러가 발생한다.

react native 버전을 올려도 별 차이가 없었고,

찾다찾다보니 android/build.gradle  파일을 수정을 하면 된다고 한다.


allprojects {

    configurations.all {

        resolutionStrategy {

            eachDependency { DependencyResolveDetails details ->

                if (details.requested.group == 'com.facebook.react' && details.requested.name == 'react-native') {

                    details.useVersion "0.36.0" // Your real React Native version here

                }

            }

        }

    }

}


굵게 표시한 부분에 현재 react native 버전을 기재를 해 주고

다시 빌드를 진행을 하면 정상적으로 설치되는 것을 확인 할 수 있다.

Comment +0

* React-Native 개발 도중 npm에서 필요한 모듈을 설치 중 pod 하여서 빌드를 하는데 오류가 발생


ld: framework not found React 

clang: error: linker command failed with exit code 1 (use -v to see invocation)




0. xCode에서 오류가 발생한 프로젝트 열기

 - Pod 사용시, ~~~.xcworkspace를 열기

1. 프로젝트 설정 화면을 선택

2. 수정할 Targets 선택

3. Build Settings 선택

4. Other Linker Flags 내용 수정

 -lc++, -ObjC 를 추가

Comment +0

react-native init를 하여 프로젝트를 초기화를 할 경우 항상 최신 버전으로 프로젝트가 세팅이 된다.


하지만 구 버전으로 프로젝트를 초기화를 해야 할 경우 아래 방법을 이용한다.


먼저 아래 package를 설치하도록 한다.


npm i -g rninit


설치가 완료가 되면 바로 사용이 가능하다.


Project Name에 원하는 이름을 넣고 실행하면 원하는 버전으로 react native project가 세팅된다.


rninit init [Project Name] --source react-native@0.28


Comment +0

React Native 에서 GIF 이미지를 출력할때 일반 이미지 출력과 동일하게 Image를 이용하여 출력을 하면 됩니다.


<Image source={require('이미지 경로(local)')} />


<Image source={{url : '이미지 경로(web)'}} />


이렇게 넣었는데 화면에 공간만 차지하고 이미지가 나오지 않는 문제가 있습니다.


이 때 android/app/src/build.gradle 파일에 아래 내용을 추가 해주어야 합니다.


dependencies {

..................


compile "com.facebook.fresco:animated-gif:0.10.0"


..................

}



그리고 다시 build를 하면 정상적으로 출력되는 이미지를 확인 할 수 있습니다.



Comment +0

React Native에서 Android에서 Wifi AP를 검색하고자 아래 모듈을 활용하였습니다.


https://github.com/devstepbcn/react-native-android-wifi


설치 방법 및 기타 사용법은 위 페이지에서 확인을 하면 되는데,


안드로이드 6.0부터 현재 AP List를 가져오도록 했는데도 불구하고 아무것도 나오지 않는 경우가 있는데


AndroidManifest.xml에 아래 항목을 추가를 합니다.


<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>


둘 중 하나만 넣어도 된다고 함


그래도 검색 결과를 가져오지 못하는데, 별도로 권한을 요청해서 승인을 받도록 해야 합니다.


앱 권한 확인 및 요청하는 부분은 https://github.com/lucasferreira/react-native-android-permissions를 이용하였습니다.


requestPermission("android.permission.ACCESS_COARSE_LOCATION").then((result) => {

console.log("Granted!", result);

}, (result) => {

console.log("Not Granted!");

console.log(result);

});


앱 실행시 권한을 요청하고 이를 승인 받도록 합니다.


해당 부분을 승인하지 않을 경우 Wifi 검색 결과를 가져오지 못하고, 승인을 해야 Wifi 검색 결과를 가져올 수 있는것으로 파악되고 있습니다.


* 참고 : http://stackoverflow.com/questions/32151603/scan-results-available-action-return-empty-list-in-android-6-0

Comment +0