Improve treeshakeability of build artifacts

packages/toolkit/package.json

@@ -50,12 +50,16 @@
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.13.5",
+    "@babel/core": "^7.24.8",
+    "@babel/helper-module-imports": "^7.24.7",
     "@microsoft/api-extractor": "^7.13.2",
     "@phryneas/ts-version": "^1.0.2",
     "@size-limit/file": "^11.0.1",
     "@size-limit/webpack": "^11.0.1",
     "@testing-library/react": "^13.3.0",
     "@testing-library/user-event": "^13.1.5",
+    "@types/babel__core": "^7.20.5",
+    "@types/babel__helper-module-imports": "^7.18.3",
     "@types/json-stringify-safe": "^5.0.0",
     "@types/nanoid": "^2.1.0",
     "@types/node": "^20.11.0",
@@ -68,7 +72,7 @@
     "axios": "^0.19.2",
     "console-testing-library": "patch:console-testing-library@npm%3A0.6.1#~/.yarn/patches/console-testing-library-npm-0.6.1-4d9957d402.patch",
     "esbuild": "^0.23.0",
-    "esbuild-extra": "^0.3.1",
+    "esbuild-extra": "^0.4.0",
     "eslint": "^7.25.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-config-react-app": "^7.0.1",

packages/toolkit/src/configureStore.ts

@@ -32,8 +32,6 @@ import type { Tuple } from './utils'
 import type { GetDefaultEnhancers } from './getDefaultEnhancers'
 import { buildGetDefaultEnhancers } from './getDefaultEnhancers'
 
-const IS_PRODUCTION = process.env.NODE_ENV === 'production'
-
 /**
  * Options for `configureStore()`.
  *
@@ -146,15 +144,22 @@ export function configureStore<
     )
   }
 
-  if (!IS_PRODUCTION && middleware && typeof middleware !== 'function') {
+  if (
+    process.env.NODE_ENV !== 'production' &&
+    middleware &&
+    typeof middleware !== 'function'
+  ) {
     throw new Error('`middleware` field must be a callback')
   }
 
   let finalMiddleware: Tuple<Middlewares<S>>
   if (typeof middleware === 'function') {
     finalMiddleware = middleware(getDefaultMiddleware)
 
-    if (!IS_PRODUCTION && !Array.isArray(finalMiddleware)) {
+    if (
+      process.env.NODE_ENV !== 'production' &&
+      !Array.isArray(finalMiddleware)
+    ) {
       throw new Error(
         'when using a middleware builder function, an array of middleware must be returned',
       )
@@ -163,7 +168,7 @@ export function configureStore<
     finalMiddleware = getDefaultMiddleware()
   }
   if (
-    !IS_PRODUCTION &&
+    process.env.NODE_ENV !== 'production' &&
     finalMiddleware.some((item: any) => typeof item !== 'function')
   ) {
     throw new Error(
@@ -176,7 +181,7 @@ export function configureStore<
   if (devTools) {
     finalCompose = composeWithDevTools({
       // Enable capture of stack traces for dispatched Redux actions
-      trace: !IS_PRODUCTION,
+      trace: process.env.NODE_ENV !== 'production',
       ...(typeof devTools === 'object' && devTools),
     })
   }
@@ -185,7 +190,11 @@ export function configureStore<
 
   const getDefaultEnhancers = buildGetDefaultEnhancers<M>(middlewareEnhancer)
 
-  if (!IS_PRODUCTION && enhancers && typeof enhancers !== 'function') {
+  if (
+    process.env.NODE_ENV !== 'production' &&
+    enhancers &&
+    typeof enhancers !== 'function'
+  ) {
     throw new Error('`enhancers` field must be a callback')
   }
 
@@ -194,19 +203,19 @@ export function configureStore<
       ? enhancers(getDefaultEnhancers)
       : getDefaultEnhancers()
 
-  if (!IS_PRODUCTION && !Array.isArray(storeEnhancers)) {
+  if (process.env.NODE_ENV !== 'production' && !Array.isArray(storeEnhancers)) {
     throw new Error('`enhancers` callback must return an array')
   }
   if (
-    !IS_PRODUCTION &&
+    process.env.NODE_ENV !== 'production' &&
     storeEnhancers.some((item: any) => typeof item !== 'function')
   ) {
     throw new Error(
       'each enhancer provided to configureStore must be a function',
     )
   }
   if (
-    !IS_PRODUCTION &&
+    process.env.NODE_ENV !== 'production' &&
     finalMiddleware.length &&
     !storeEnhancers.includes(middlewareEnhancer)
   ) {

packages/toolkit/src/createDraftSafeSelector.ts

@@ -26,4 +26,5 @@ export const createDraftSafeSelectorCreator: typeof createSelectorCreator = (
  * @public
  */
 export const createDraftSafeSelector =
+  /* @__PURE__ */
   createDraftSafeSelectorCreator(weakMapMemoize)

packages/toolkit/src/listenerMiddleware/index.ts

@@ -217,7 +217,7 @@ const getListenerEntryPropsFrom = (options: FallbackAddListenerOptions) => {
 
 /** Accepts the possible options for creating a listener, and returns a formatted listener entry */
 export const createListenerEntry: TypedCreateListenerEntry<unknown> =
-  Object.assign(
+  /* @__PURE__ */ assign(
     (options: FallbackAddListenerOptions) => {
       const { type, predicate, effect } = getListenerEntryPropsFrom(options)
 
@@ -282,21 +282,29 @@ const safelyNotifyError = (
 /**
  * @public
  */
-export const addListener = Object.assign(createAction(`${alm}/add`), {
-  withTypes: () => addListener,
-}) as unknown as TypedAddListener<unknown>
+export const addListener = /* @__PURE__ */ assign(
+  /* @__PURE__ */ createAction(`${alm}/add`),
+  {
+    withTypes: () => addListener,
+  },
+) as unknown as TypedAddListener<unknown>
 
 /**
  * @public
  */
-export const clearAllListeners = createAction(`${alm}/removeAll`)
+export const clearAllListeners = /* @__PURE__ */ createAction(
+  `${alm}/removeAll`,
+)
 
 /**
  * @public
  */
-export const removeListener = Object.assign(createAction(`${alm}/remove`), {
-  withTypes: () => removeListener,
-}) as unknown as TypedRemoveListener<unknown>
+export const removeListener = /* @__PURE__ */ assign(
+  /* @__PURE__ */ createAction(`${alm}/remove`),
+  {
+    withTypes: () => removeListener,
+  },
+) as unknown as TypedRemoveListener<unknown>
 
 const defaultErrorHandler: ListenerErrorHandler = (...args: unknown[]) => {
   console.error(`${alm}/error`, ...args)
@@ -346,7 +354,7 @@ export const createListenerMiddleware = <
     return insertEntry(entry)
   }) as AddListenerOverloads<any>
 
-  Object.assign(startListening, {
+  assign(startListening, {
     withTypes: () => startListening,
   })
 
@@ -374,7 +382,7 @@ export const createListenerMiddleware = <
     return !!entry
   }
 
-  Object.assign(stopListening, {
+  assign(stopListening, {
     withTypes: () => stopListening,
   })
 

packages/toolkit/src/query/react/ApiProvider.tsx

@@ -2,7 +2,7 @@ import { configureStore } from '@reduxjs/toolkit'
 import type { Context } from 'react'
 import { useContext } from 'react'
 import { useEffect } from 'react'
-import React from 'react'
+import * as React from 'react'
 import type { ReactReduxContextValue } from 'react-redux'
 import { Provider, ReactReduxContext } from 'react-redux'
 import { setupListeners } from '@reduxjs/toolkit/query'

packages/toolkit/tsup.config.ts

@@ -180,7 +180,7 @@ export default defineConfig((options) => {
 
         if (env) {
           Object.assign(defineValues, {
-            'process.env.NODE_ENV': JSON.stringify(env),
+            NODE_ENV: env,
           })
         }
 
@@ -200,15 +200,8 @@ export default defineConfig((options) => {
           sourcemap: true,
           external: externals,
           esbuildPlugins: [mangleErrorsTransform],
-          esbuildOptions(options) {
-            // Needed to prevent auto-replacing of process.env.NODE_ENV in all builds
-            options.platform = 'neutral'
-            // Needed to return to normal lookup behavior when platform: 'neutral'
-            options.mainFields = ['browser', 'module', 'main']
-            options.conditions = ['browser']
-          },
 
-          define: defineValues,
+          env: defineValues,
           async onSuccess() {
             if (format === 'cjs' && name === 'production.min') {
               writeCommonJSEntry(outputFolder, prefix)
@@ -244,7 +237,7 @@ export default defineConfig((options) => {
               // fs.copyFileSync(inputTypedefsPath, outputTypedefsPath)
             }
           },
-        }
+        } satisfies TsupOptions
       })
 
       return artifactOptions satisfies TsupOptions[]