Remove invariant in favor of doing NODE_ENV checks directly (reduxjs#…

…1472)

package.json

@@ -50,7 +50,6 @@
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "hoist-non-react-statics": "^3.3.0",
-    "invariant": "^2.2.4",
     "loose-envify": "^1.4.0",
     "prop-types": "^15.7.2",
     "react-is": "^16.9.0"

src/components/connectAdvanced.js

@@ -1,5 +1,4 @@
 import hoistStatics from 'hoist-non-react-statics'
-import invariant from 'invariant'
 import React, { useContext, useMemo, useRef, useReducer } from 'react'
 import { isValidElementType, isContextConsumer } from 'react-is'
 import Subscription from '../utils/Subscription'
@@ -78,34 +77,40 @@ export default function connectAdvanced(
     ...connectOptions
   } = {}
 ) {
-  invariant(
-    renderCountProp === undefined,
-    `renderCountProp is removed. render counting is built into the latest React Dev Tools profiling extension`
-  )
-
-  invariant(
-    !withRef,
-    'withRef is removed. To access the wrapped instance, use a ref on the connected component'
-  )
-
-  const customStoreWarningMessage =
-    'To use a custom Redux store for specific components, create a custom React context with ' +
-    "React.createContext(), and pass the context object to React Redux's Provider and specific components" +
-    ' like: <Provider context={MyContext}><ConnectedComponent context={MyContext} /></Provider>. ' +
-    'You may also pass a {context : MyContext} option to connect'
-
-  invariant(
-    storeKey === 'store',
-    'storeKey has been removed and does not do anything. ' +
-      customStoreWarningMessage
-  )
+  if (process.env.NODE_ENV !== 'production') {
+    if (renderCountProp !== undefined) {
+      throw new Error(
+        `renderCountProp is removed. render counting is built into the latest React Dev Tools profiling extension`
+      )
+    }
+    if (withRef) {
+      throw new Error(
+        'withRef is removed. To access the wrapped instance, use a ref on the connected component'
+      )
+    }
+
+    const customStoreWarningMessage =
+      'To use a custom Redux store for specific components, create a custom React context with ' +
+      "React.createContext(), and pass the context object to React Redux's Provider and specific components" +
+      ' like: <Provider context={MyContext}><ConnectedComponent context={MyContext} /></Provider>. ' +
+      'You may also pass a {context : MyContext} option to connect'
+
+    if (storeKey !== 'store') {
+      throw new Error(
+        'storeKey has been removed and does not do anything. ' +
+          customStoreWarningMessage
+      )
+    }
+  }
 
   const Context = context
 
   return function wrapWithConnect(WrappedComponent) {
-    if (process.env.NODE_ENV !== 'production') {
-      invariant(
-        isValidElementType(WrappedComponent),
+    if (
+      process.env.NODE_ENV !== 'production' &&
+      !isValidElementType(WrappedComponent)
+    ) {
+      throw new Error(
         `You must pass a component to the function returned by ` +
           `${methodName}. Instead received ${stringifyComponent(
             WrappedComponent
@@ -173,13 +178,18 @@ export default function connectAdvanced(
       const didStoreComeFromContext =
         Boolean(contextValue) && Boolean(contextValue.store)
 
-      invariant(
-        didStoreComeFromProps || didStoreComeFromContext,
-        `Could not find "store" in the context of ` +
-          `"${displayName}". Either wrap the root component in a <Provider>, ` +
-          `or pass a custom React context provider to <Provider> and the corresponding ` +
-          `React context consumer to ${displayName} in connect options.`
-      )
+      if (
+        process.env.NODE_ENV !== 'production' &&
+        !didStoreComeFromProps &&
+        !didStoreComeFromContext
+      ) {
+        throw new Error(
+          `Could not find "store" in the context of ` +
+            `"${displayName}". Either wrap the root component in a <Provider>, ` +
+            `or pass a custom React context provider to <Provider> and the corresponding ` +
+            `React context consumer to ${displayName} in connect options.`
+        )
+      }
 
       // Based on the previous check, one of these must be true
       const store = didStoreComeFromProps ? props.store : contextValue.store

src/hooks/useReduxContext.js

@@ -1,5 +1,4 @@
 import { useContext } from 'react'
-import invariant from 'invariant'
 import { ReactReduxContext } from '../components/Context'
 
 /**
@@ -21,10 +20,11 @@ import { ReactReduxContext } from '../components/Context'
 export function useReduxContext() {
   const contextValue = useContext(ReactReduxContext)
 
-  invariant(
-    contextValue,
-    'could not find react-redux context value; please ensure the component is wrapped in a <Provider>'
-  )
+  if (process.env.NODE_ENV !== 'production' && !contextValue) {
+    throw new Error(
+      'could not find react-redux context value; please ensure the component is wrapped in a <Provider>'
+    )
+  }
 
   return contextValue
 }

src/hooks/useSelector.js

@@ -1,5 +1,4 @@
 import { useReducer, useRef, useMemo, useContext } from 'react'
-import invariant from 'invariant'
 import { useReduxContext as useDefaultReduxContext } from './useReduxContext'
 import Subscription from '../utils/Subscription'
 import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect'
@@ -95,8 +94,9 @@ export function createSelectorHook(context = ReactReduxContext) {
       ? useDefaultReduxContext
       : () => useContext(context)
   return function useSelector(selector, equalityFn = refEquality) {
-    invariant(selector, `You must pass a selector to useSelectors`)
-
+    if (process.env.NODE_ENV !== 'production' && !selector) {
+      throw new Error(`You must pass a selector to useSelectors`)
+    }
     const { store, subscription: contextSub } = useReduxContext()
 
     return useSelectorWithStoreAndSubscription(