undefined is not an object (evaluating '_reactNative.Appearance.getColorScheme') w/ v4.0

Current behaviour

After updating npm package to v4.0.0, app will not start and throws following error:

undefined is not an object (evaluating '_reactNative.Appearance.getColorScheme')
- node_modules/react-native-paper/src/core/Provider.tsx:22:10 in Provider
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:8251:26 in constructClassInstance
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:12940:6 in updateClassComponent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:307:15 in invokeGuardedCallbackImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:531:36 in invokeGuardedCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:20488:8 in beginWork$$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19370:24 in performUnitOfWork
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19347:39 in workLoopSync
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18997:22 in renderRoot
* [native code]:null in renderRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18709:28 in runRootCallback
* [native code]:null in runRootCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5642:32 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:643:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5638:22 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5627:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18556:30 in scheduleUpdateOnFiber
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:11484:17 in dispatchAction
* [native code]:null in dispatchAction
* App.js:57:8 in loadResourcesAndDataAsync
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:274:30 in invoke
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:135:28 in invoke
- node_modules/regenerator-runtime/runtime.js:145:19 in PromiseImpl.resolve.then$argument_0
- node_modules/promise/setimmediate/core.js:37:14 in tryCallOne
- node_modules/promise/setimmediate/core.js:123:25 in setImmediate$argument_0
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:146:14 in _callTimer
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:194:17 in _callImmediatesPass
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:458:30 in callImmediates
* [native code]:null in callImmediates
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:407:6 in __callImmediates
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:143:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:384:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:142:17 in __guard$argument_0
* [native code]:null in flushedQueue
* [native code]:null in invokeCallbackAndReturnFlushedQueue

Expected behaviour

Provider would work as intended in v3.*

Code sample

const theme = {
    ...DefaultTheme,
    roundness: 8,
    colors: {
        ...DefaultTheme.colors,
        primary: "#FF6400",
        accent: "#0096af",
        textContrast: "#fff",
    },
};
...
export default function App(props) {
    ...
    return(
        <ReduxProvider store={store}>
            <PersistGate
                loading={<ActivityIndicator />}
                persistor={persistor}
            >
                <PaperProvider theme={theme}>
                    <TouchableWithoutFeedback
                        onPress={() => {
                            Keyboard.dismiss();
                        }}
                    >
                        <SafeAreaProvider>
                            <RootNavigator
                                ref={containerRef}
                                initialState={initialNavigationState}
                            />
                        </SafeAreaProvider>
                    </TouchableWithoutFeedback>
                </PaperProvider>
            </PersistGate>
        </ReduxProvider>
    );
}

Screenshots (if applicable)

What have you tried

Your Environment

software	version
ios or android	ios emulator 13.1
react-native	https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz
react-native-paper	^4.0.0
node
npm or yarn	6.14.4
expo sdk	~37.0.3

[thomashagstrom]

@Trancever I’m on 4.2.0 and still get it

Failed to compile.

./node_modules/react-native-paper/lib/module/core/Provider.js Attempted import error: ‘Appearance’ is not exported from ‘react-native’.

package.json

"dependencies": {
  "core-js": "3",
  "file-loader": "^6.1.0",
  "react": "16.13.1",
  "react-app-rewired": "^2.1.6",
  "react-art": "^16.13.1",
  "react-dom": "^16.13.1",
  "react-native": "0.63.2",
  "react-native-paper": "^4.2.0",
  "react-native-vector-icons": "^7.1.0",
  "react-native-web": "^0.11.0-alpha.3"
},

config-overrides.js

    config.module.rules.push({
      test: /\.js$/,
      exclude: /node_modules[/\\](?!react-native-vector-icons|react-native-safe-area-view)/,
      use: {
        loader: 'babel-loader',
        options: {
          // Disable reading babel configuration
          babelrc: false,
          configFile: false,

          // The configuration for compilation
          presets: [
            ['@babel/preset-env', {useBuiltIns: 'usage'}],
            '@babel/preset-react',
            '@babel/preset-flow',
            '@babel/preset-typescript',
          ],
          plugins: [
            '@babel/plugin-proposal-class-properties',
            '@babel/plugin-proposal-object-rest-spread',
          ],
        },
      },
    });

[satya164]

We still need to address this to support React Native Web.