React-native-snap-carousel not compatible with React Native Web causing TypeError

Getting the error TypeError: Cannot read property 'style' of undefined when running expo web. I think it’s to do with ViewPropTypes being deprecated. How can I fix this for web? I’m currently using Expo and React Native. Problem replicated in react-native-snap-carousel - Snack has shown

Trying to figure out a similar error too. It absolutely is related to ViewPropTypes being deprecated, however I haven’t been able to find a solution.

Any luck?

So going based on a script I saw on the React Native Web Github issue queue:

I’ve made some edits to account for TextPropTypes as well, and after using this script (you’ll need to install the npm package postinstall), everything compiles correctly as far as I can tell (there is a warning in the console log). Just put this in your root directory as, and add a postinstall script to package.json:

import os
import sys

print("✅ Fixing PropTypes issues")
dir_path = os.path.dirname(os.path.realpath(__file__))
rnw_filename = dir_path + "/./node_modules/react-native-web/dist/index.js"
rnw_text_filename = dir_path + "/./node_modules/react-native-web/dist/exports/Text/index.js"

def append_new_line(file_name, text_to_append):
    """Append given text as a new line at the end of file"""

    if text_to_append in open(file_name).read():
        print("⏭️  Skipping...")
        with open(file_name, "a+") as file_object:

def replace_line(file_name, line_num, text):
    lines = open(file_name, 'r').readlines()
    lines[line_num] = text
    out = open(file_name, 'w')

# Fix
append_new_line(rnw_filename, "export const ViewPropTypes = { style: null };")
replace_line(rnw_text_filename, -1, "Text.propTypes = {style: null};")
append_new_line(rnw_text_filename, "export default Text;")
1 Like


Thanks. It works. But I modified it as below because of another warning.

# Fix
append_new_line(rnw_filename, "export const ViewPropTypes = { style: () => null };")
replace_line(rnw_text_filename, -1, "Text.propTypes = {style: () => null};")

I have that same problem. did you find a solution? react-native-snap-carousel for using the component react native web?

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.