No +[RCTConvert WKDataDetectorTypes:] function found . | Expo 51 - React Native

[quuentinho]

Since I updated the Expo SDK version (v 51), which led to updating a number of dependencies, I encounter an error when I arrive at the screen where I integrated react-native-cn-quill. You will find the error below :

Additionally, you will also find my implementation code. Do you know where this might be coming from?

import { Keyboard } from "react-native"
import QuillEditor, { QuillToolbar } from 'react-native-cn-quill';

const Wysiwyg = ({
    editorStyle,
    displayToolbar,
    richText,
    initialContentHTML,
    placeholder,
    onChange
}) => {
    const toolbarOptions = [
        ['bold', 'italic', 'underline', 'strike'],
        ['blockquote', 'code-block'],
        ['link'],

        [{ 'header': 1 }, { 'header': 2 }],
        [{ 'list': 'ordered'}, { 'list': 'bullet' }, { 'list': 'check' }],
        [{ 'indent': '-1'}, { 'indent': '+1' }],

        [{ 'header': [1, 2, 3, 4, 5, 6, false] }],

        [{ 'color': [] }, { 'background': [] }],
        [{ 'font': [] }],
        [{ 'align': [] }],
    ]

    const handleBlur = () => {
        Keyboard.dismiss()
    }

    return (
        <>
            <QuillEditor
                container={true}
                style={editorStyle}
                ref={richText}
                initialHtml={initialContentHTML}
                quill={
                    {
                        theme: 'snow',
                        placeholder: placeholder,
                        modules: {
                            toolbar: false
                        }
                    }
                }
                onHtmlChange={({html}) => onChange(html)}
                onBlur={handleBlur}
            />
            { displayToolbar && <QuillToolbar editor={richText} options={toolbarOptions} theme="light" />}
        </>
    )
}

export default Wysiwyg

Here are the versions of my dependencies:

"dependencies": {
        "@babel/core": "^7.24.5",
        "@babel/preset-typescript": "^7.23.3",
        "@os-team/i18next-react-native-language-detector": "^1.0.31",
        "@react-native-async-storage/async-storage": "1.23.1",
        "@react-native-picker/picker": "2.7.5",
        "@react-navigation/bottom-tabs": "^6.5.1",
        "@react-navigation/drawer": "^6.1.8",
        "@react-navigation/native": "^6.0.6",
        "@react-navigation/native-stack": "^6.9.14",
        "@reduxjs/toolkit": "^1.9.0",
        "axios": "^0.25.0",
        "date-fns": "^2.28.0",
        "expo": "~51.0.8",
        "expo-camera": "~15.0.9",
        "expo-constants": "~16.0.1",
        "expo-device": "~6.0.2",
        "expo-file-system": "~17.0.1",
        "expo-font": "~12.0.5",
        "expo-image-manipulator": "~12.0.5",
        "expo-image-picker": "~15.0.5",
        "expo-linear-gradient": "~13.0.2",
        "expo-linking": "~6.3.1",
        "expo-localization": "~15.0.3",
        "expo-location": "~17.0.1",
        "expo-media-library": "~16.0.3",
        "expo-notifications": "~0.28.3",
        "expo-secure-store": "~13.0.1",
        "expo-sharing": "~12.0.1",
        "expo-splash-screen": "~0.27.4",
        "expo-store-review": "~7.0.2",
        "expo-updates": "~0.25.14",
        "i18n-js": "^3.7.1",
        "i18next": "^23.7.19",
        "lottie-react-native": "6.7.0",
        "react": "18.2.0",
        "react-i18next": "^14.0.1",
        "react-native": "^0.74.1",
        "react-native-auto-height-image": "^3.2.4",
        "react-native-autocomplete-input": "^5.2.0",
        "react-native-autoheight-webview": "^1.6.5",
        "react-native-cn-quill": "^0.7.18",
        "react-native-country-flag": "^2.0.2",
        "react-native-country-picker-modal": "^2.0.0",
        "react-native-gesture-handler": "~2.16.1",
        "react-native-global-props": "^1.1.5",
        "react-native-image-pan-zoom": "^2.1.12",
        "react-native-image-zoom-viewer": "^3.0.1",
        "react-native-maps": "1.14.0",
        "react-native-maps-directions": "^1.9.0",
        "react-native-pager-view": "6.3.0",
        "react-native-phone-input": "^1.3.5",
        "react-native-places-input": "^1.1.7",
        "react-native-reanimated": "~3.10.1",
        "react-native-safe-area-context": "4.10.1",
        "react-native-screens": "3.31.1",
        "react-native-store-version": "^1.3.2",
        "react-native-svg": "15.2.0",
        "react-native-switch": "^1.5.1",
        "react-native-switch-selector": "^2.3.0",
        "react-native-tab-view": "^3.5.2",
        "react-native-webview": "13.8.6",
        "react-query": "^3.39.2",
        "react-redux": "^8.0.5",
        "redux": "^4.2.0",
        "rgb2hex": "^0.2.5",
        "string-similarity": "^4.0.4"
    },
    "devDependencies": {
        "@babel/plugin-transform-template-literals": "^7.24.1",
        "babel-preset-expo": "~11.0.0"
    },

Thanks,

Have a good day.

[sefailyasoz95]

facing the same issue, expo 51

[sajjadjaved01]

if you are running it on Expo 51 with Expo Go you can dismiss the error and continue using the editor. Else you have to create a development build to get rid of this error.

[InnVardhan]

Tried #3436 but still no luck. Anyone found a fix for it?

[InnRonin]

Tried #3436 but still no luck. Anyone found a fix for it?

https://github.com/react-native-webview/react-native-webview/issues/3426#issuecomment-2175325416

[Ruchita-Work]

I am also facing same issue with expo sdk 51