UI Kitten & React Native Web no custom mapping

Question

I am having an issue trying to load the most basic custom mapping in React Native Web. The custom styles are loading just fine in the App, but not Web. Using the latest version with the babel loader hack as proposed here. I am using the default mapping as proposed in the UI Kitten docs for v5.x

My code looks like this:

import * as eva from '@eva-design/eva'
import * as mapping from '../styles/mapping.json'
import { myTheme } from '../styles/light-theme'

export default function App(): React.ReactElement {
    return <>
            <ApplicationProvider {...eva} theme={myTheme} customMapping={mapping}>
             ...
            </ApplicationProvider>
        </>
}

Answer 1

I tried replicating with a blank repo and it was working fine, so one line at a time I figured out that my import was not correct (not readable by babel?).

Instead of:

import * as mapping from '../styles/mapping.json'

Should be:

import {default as mapping} from '../styles/mapping.json'

The correct way is suggested in the UIKitten docs, so I don't think it will happen to many, but may help others as it's not an obvious thing if someone is working with the App emulator for the most time and not checking the Web until later.