Skip to content

Android: Invariant Violation requireNativeComponent: "RNCViewPager" was ton found in the UIManager #1050

New issue
New issue
Open
Open
Android: Invariant Violation requireNativeComponent: "RNCViewPager" was ton found in the UIManager#1050
@zmnv

Description

@zmnv
zmnv
opened on Oct 29, 2019 · edited by zmnv
  • I have searched existing issues
    I am using the latest scrollable tab view version

I've just update react-native-scrollable-tab-view to 1.0.0 by yarn. But still have error.

Steps to Reproduce

yarn add react-native-scrollable-tab-view@1.0.0

import ScrollableTabView, { ScrollableTabBar } from 'react-native-scrollable-tab-view';
....
<ScrollableTabView
    style={{ marginTop: 0, marginBottom: 10, height: 50, flex: 0 }}
    onChangeTab={this...}
    initialPage={0}
    renderTabBar={() => (
        <ScrollableTabBar
            activeTextColor="..."
            inactiveTextColor="..."
            style={{
                ...
            }}
            tabsContainerStyle={{
                ...
            }}
            underlineStyle={{
                height: 2,
            ...
            }}
            tabStyle={{
                ...
            }}
            textStyle={{ fontSize: 12, fontWeight: 'normal' }}
        />
    )}
>
    {metrics.map(metricName => (
        <View
            key={metricName}
            tabLabel={metricName}
        >
            <Text>{metricName}</Text>
        </View>
    ))}
</ScrollableTabView>

Expected Behavior

Should work because I setup latest version of module. And in yarn.lock:

image

also ViewPager there is in node_modules:

Actual Behavior

Android

iOS
All fine.

I've try

  • Clean yarn cache
  • Clean react native & metro cache
  • rm -rf node_modules
  • delete build folders

Activity

zmnv

zmnv commented on Oct 29, 2019

@zmnv
zmnv
on Oct 29, 2019
Author

I look at:
/node_modules/react-native-scrollable-tab-view/index.js

Why do you use Animated.ScrollView for iOS and AnimatedViewPagerAndroid for Android? Can you use Animated.ScrollView for all?

also there are definitions which don't used

zmnv
mentioned this on Oct 29, 2019
zmnv

zmnv commented on Oct 29, 2019

@zmnv
zmnv
on Oct 29, 2019
Author

temporary solution is just:

yarn add @react-native-community/viewpager

but I don't want to install that module direct into project :(

ptomasroos

ptomasroos commented on Oct 29, 2019

@ptomasroos
ptomasroos
on Oct 29, 2019
Owner

I would love to have a PR on a scroll based solution of android. It’s there for historical reasons.

haack

haack commented on Oct 31, 2019

@haack
haack
on Oct 31, 2019

I have the same issue on Android. Manually adding @react-native-community/viewpager didn't solve the problem for me.

zunsakai

zunsakai commented on Oct 31, 2019

@zunsakai
zunsakai
on Oct 31, 2019

same issue ...

cereme

cereme commented on Nov 2, 2019

@cereme
cereme
on Nov 2, 2019

I have same issue too

vetrivendhan48

vetrivendhan48 commented on Nov 4, 2019

@vetrivendhan48
vetrivendhan48
on Nov 4, 2019

temporary solution is just:

yarn add @react-native-community/viewpager

but I don't want to install that module direct into project :(

I guess there will be no issue in doing that I guess. npm will manage dependencies right? Is there will be any issue will come if you modify its dependencies? Please let me know.
Thanks

zmnv

zmnv commented on Nov 4, 2019

@zmnv
zmnv
on Nov 4, 2019 · edited by zmnv
Author

@vetrivendhan48 not a big deal actually, but.

But when you search in project directory @react-native-community/viewpager it's returns nothing. Then other developers thinks like 'oh, that dependency is not used in project so it unnecessary, I can delete it!'.

And build fails next time)))))))

also guys above says that solution didn't work. I don't know why. In my case it works.

azamouchi

azamouchi commented on Nov 6, 2019

@azamouchi
azamouchi
on Nov 6, 2019

yarn add @react-native-community/viewpager on it's own does not solve the issue, you need to link the package also using react-native link @react-native-community/viewpager

w13808604

w13808604 commented on Nov 8, 2019

@w13808604
w13808604
on Nov 8, 2019

same issue ..anybody solve it

chenyanfei-m

chenyanfei-m commented on Nov 8, 2019

@chenyanfei-m
chenyanfei-m
on Nov 8, 2019 · edited by chenyanfei-m

yarn add @react-native-community/viewpager
react-native link @react-native-community/viewpager
and rebuild, solve it ✨

mastahed

mastahed commented on Nov 12, 2019

@mastahed
mastahed
on Nov 12, 2019

Any fix for expo 35 with RN 0.59? works well on IOS, android shows the same error. Tried link and manual installation of viewpager.

kaiyes

kaiyes commented on Nov 18, 2019

@kaiyes
kaiyes
on Nov 18, 2019 · edited by kaiyes

yarn add @react-native-community/viewpager
react-native link @react-native-community/viewpager
and rebuild and solve it

This worked for me

xgAnd

xgAnd commented on Nov 18, 2019

@xgAnd
xgAnd
on Nov 18, 2019

yarn add @react-native-community/viewpager
react-native link @react-native-community/viewpager
and rebuild and solve it

worked react-native version is 0.61.3

31 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @ptomasroos@nabilfreeman@douglassoldan@zchuhui@kaiyes

        Issue actions
          Android: Invariant Violation requireNativeComponent: "RNCViewPager" was ton found in the UIManager · Issue #1050 · ptomasroos/react-native-scrollable-tab-view