Merge pull request #1013 from reduxjs/feature/rtkq-ts40-compat

Author: markerikson

jest.config.js

@@ -10,6 +10,9 @@ module.exports = {
   globals: {
     'ts-jest': {
       tsconfig: 'tsconfig.test.json',
+      diagnostics: {
+        ignoreCodes: [6133],
+      },
     },
   },
 }

package-lock.json

@@ -2,6 +2,8 @@
   "name": "@reduxjs/toolkit",
   "version": "1.6.0-alpha.0",
   "description": "The official, opinionated, batteries-included toolset for efficient Redux development",
+  "author": "Mark Erikson <[email protected]>",
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/reduxjs/redux-toolkit.git"
@@ -23,35 +25,6 @@
   "module": "dist/redux-toolkit.esm.js",
   "unpkg": "dist/redux-toolkit.umd.min.js",
   "types": "dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "module": "./dist/redux-toolkit.esm.js",
-      "default": "./dist/index.js"
-    },
-    "./query": {
-      "types": "./query/index.d.ts",
-      "module": "./query/rtk-query.esm.js",
-      "default": "./query/index.js"
-    },
-    "./query/react": {
-      "types": "./query/react.d.ts",
-      "module": "./query/react/rtk-query-react.esm.js",
-      "default": "./query/react/index.js"
-    }
-  },
-  "typesVersions": {
-    "*": {
-      "query": [
-        "./query/index.d.ts"
-      ],
-      "query/react": [
-        "./query/react.d.ts"
-      ]
-    }
-  },
-  "author": "Mark Erikson <[email protected]>",
-  "license": "MIT",
   "devDependencies": {
     "@microsoft/api-extractor": "^7.13.2",
     "@testing-library/react": "^11.2.6",
@@ -72,7 +45,7 @@
     "console-testing-library": "^0.3.1",
     "convert-source-map": "^1.7.0",
     "cross-fetch": "^3.1.4",
-    "esbuild": "0.8.57",
+    "esbuild": "^0.11.13",
     "eslint-config-react-app": "^5.0.1",
     "fs-extra": "^9.1.0",
     "invariant": "^2.2.4",
@@ -95,8 +68,8 @@
     "yargs": "^15.3.1"
   },
   "scripts": {
-    "build-ci": "rimraf dist query && tsc && node scripts/cli.js",
-    "build": "rimraf dist query && tsc && node scripts/cli.js --skipExtraction",
+    "build-ci": "rimraf dist && tsc && node scripts/cli.js",
+    "build": "rimraf dist && tsc && node scripts/cli.js --local",
     "dev": "tsdx watch  --format cjs,esm,system,umd",
     "format": "prettier --write \"src/**/*.{ts,tsx}\" \"**/*.md\"",
     "format:check": "prettier --list-different \"src/**/*.{ts,tsx}\" \"docs/*/**.md\"",
@@ -119,18 +92,19 @@
     "redux-thunk": "^2.3.0",
     "reselect": "^4.0.0"
   },
-  "sideEffects": false,
-  "jest": {
-    "globals": {
-      "ts-jest": {
-        "diagnostics": {
-          "ignoreCodes": [
-            6133
-          ]
-        }
-      }
+  "peerDependencies": {
+    "react": "^16.14.0 || ^17.0.0",
+    "react-redux": "^7.2.1"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-redux": {
+      "optional": true
     }
   },
+  "sideEffects": false,
   "bugs": {
     "url": "https://github.com/reduxjs/redux-toolkit/issues"
   },

package.json

@@ -5,14 +5,7 @@
   "main": "../../dist/query/react/index.js",
   "module": "../../dist/query/react/rtk-query-react.esm.js",
   "unpkg": "../../dist/query/react/rtk-query-react.umd.min.js",
-  "types": "../../dist/query/react/index.d.ts",
   "author": "Mark Erikson <[email protected]>",
   "license": "MIT",
-  "typesVersions": {
-    "<4.1": {
-      "index.d.ts": [ 
-        "../../dist/query/react/indexTs40.d.ts"
-      ]
-    }
-  }
-}
+  "types": "../../dist/query/react/index.d.ts"
+}

query/react/package.json

@@ -5,21 +5,20 @@ import terser from 'terser'
 import rollup from 'rollup'
 import path from 'path'
 import fs from 'fs-extra'
-import MagicString from 'magic-string'
-import { appendInlineSourceMap, getLocation } from './sourcemap'
 import ts from 'typescript'
 import { RawSourceMap, SourceMapConsumer } from 'source-map'
 import merge from 'merge-source-map'
-import { extractInlineSourcemap, removeInlineSourceMap } from './sourcemap'
-import type { BuildOptions, EntryPointOptions } from './types'
-import assert from 'assert'
 import {
   Extractor,
   ExtractorConfig,
   ExtractorResult,
 } from '@microsoft/api-extractor'
 import yargs from 'yargs/yargs'
 
+import { extractInlineSourcemap, removeInlineSourceMap } from './sourcemap'
+import type { BuildOptions, EntryPointOptions } from './types'
+import { appendInlineSourceMap, getLocation } from './sourcemap'
+
 const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms))
 
 const { argv } = yargs(process.argv)
@@ -50,7 +49,6 @@ const buildTargets: BuildOptions[] = [
     minify: true,
     env: 'production',
   },
-
   // ESM, embedded `process`, ES5 syntax: typical Webpack dev
   {
     format: 'esm',
@@ -66,7 +64,6 @@ const buildTargets: BuildOptions[] = [
     minify: false,
     env: '',
   },
-
   // ESM, pre-compiled "dev", ES2017 syntax: browser development
   {
     format: 'esm',
@@ -104,7 +101,6 @@ const entryPoints: EntryPointOptions[] = [
     entryPoint: 'src/index.ts',
     extractionConfig: 'api-extractor.json',
   },
-  // TODO The alternate entry point outputs are likely not importable this way. Need to sort that out.
   {
     prefix: 'rtk-query',
     folder: 'query',
@@ -114,7 +110,7 @@ const entryPoints: EntryPointOptions[] = [
   {
     prefix: 'rtk-query-react',
     folder: 'query/react',
-    entryPoint: 'src/query/react.ts',
+    entryPoint: 'src/query/react/index.ts',
     extractionConfig: 'api-extractor.query-react.json',
   },
 ]
@@ -149,8 +145,12 @@ async function bundle(options: BuildOptions & EntryPointOptions) {
     target: 'esnext',
     sourcemap: 'inline',
     bundle: true,
-    external: ['react', 'react-redux'],
     format: format === 'umd' ? 'esm' : format,
+    // Needed to prevent auto-replacing of process.env.NODE_ENV in all builds
+    platform: 'neutral',
+    // Needed to return to normal lookup behavior when platform: 'neutral'
+    mainFields: ['browser', 'module', 'main'],
+    conditions: ['browser'],
     define: env
       ? {
           'process.env.NODE_ENV': JSON.stringify(env),
@@ -209,7 +209,6 @@ async function bundle(options: BuildOptions & EntryPointOptions) {
 
     const mergedSourcemap = merge(sourcemap, result.sourceMapText)
     let code = result.outputText
-    // TODO Is this used at all?
     let mapping: RawSourceMap = mergedSourcemap
 
     if (minify) {
@@ -236,39 +235,6 @@ async function bundle(options: BuildOptions & EntryPointOptions) {
     console.log('Build artifact:', chunk.path)
     await fs.writeFile(chunk.path, code)
     await fs.writeJSON(chunk.path + '.map', mapping)
-    const smc = await new SourceMapConsumer(mapping)
-    /*
-    const stubMap = {
-      '../src/configureStore.ts': [
-        `"reducer" is a required argument, and must be a function or an object of functions that can be passed to combineReducers`,
-      ],
-    }
-    for (const [source, stubList] of Object.entries(stubMap)) {
-      for (const stub of stubList) {
-        const originContent = smc.sourceContentFor(source)
-        const originLocation = getLocation(originContent, stub)
-        const bundledPosition = getLocation(code, stub)
-        const recoverLocation = smc.originalPositionFor({
-          line: bundledPosition.line,
-          column: bundledPosition.column,
-        })
-        assert.deepStrictEqual(
-          source,
-          recoverLocation.source,
-          `sourceFile: expected ${source} but got ${recoverLocation.source}`
-        )
-        assert(
-          Math.abs(originLocation.line - recoverLocation.line) <= 1,
-          `line: expected ${originLocation.line} but got ${recoverLocation.line}`
-        )
-        assert(
-          Math.abs(originLocation.column - recoverLocation.column) <= 1,
-          `column: expected ${originLocation.column} but got ${recoverLocation.column}`
-        )
-      }
-      
-    }
-    */
   }
 }
 
@@ -302,6 +268,7 @@ async function buildUMD(outputPath: string, prefix: string) {
   }
 }
 
+// Generates an index file to handle importing CJS dev/prod
 async function writeEntry(folder: string, prefix: string) {
   await fs.writeFile(
     path.join('dist', folder, 'index.js'),
@@ -320,7 +287,7 @@ interface BuildArgs {
 }
 
 async function main({ skipExtraction = false, local = false }: BuildArgs) {
-  //await fs.remove(outputDir)
+  // Dist folder will be removed by rimraf beforehand so TSC can generate typedefs
   await fs.ensureDir(outputDir)
 
   for (let entryPoint of entryPoints) {
@@ -337,16 +304,22 @@ async function main({ skipExtraction = false, local = false }: BuildArgs) {
     )
     await Promise.all(bundlePromises)
     await writeEntry(folder, prefix)
+  }
 
-    if (folder) {
-      const packageSource = path.join('src', folder, 'package.json')
-      const packageDest = path.join(outputPath, 'package.json')
-    }
-
-    await sleep(500) // hack, waiting file to save
+  // Run UMD builds after everything else so we don't have to sleep after each set
+  for (let entryPoint of entryPoints) {
+    const { folder } = entryPoint
+    const outputPath = path.join('dist', folder)
     await buildUMD(outputPath, entryPoint.prefix)
   }
 
+  // We need one additional package.json file in dist to support
+  // versioned types for TS <4.1
+  fs.copyFileSync(
+    'src/query/react/versionedTypes/package.json',
+    'dist/query/react/versionedTypes/package.json'
+  )
+
   if (!skipExtraction) {
     for (let entryPoint of entryPoints) {
       // Load and parse the api-extractor.json file
@@ -377,9 +350,7 @@ async function main({ skipExtraction = false, local = false }: BuildArgs) {
       }
     }
   }
-
-
-  // addSubpath()
 }
+
 const { skipExtraction, local } = argv
 main({ skipExtraction, local })

scripts/build.ts

@@ -25,7 +25,6 @@ import {
   FullTagDescription,
 } from '../endpointDefinitions'
 import { CombinedState, QueryKeys, RootState } from './apiState'
-import './buildSelectors'
 import { Api, Module } from '../apiTypes'
 import { onFocus, onFocusLost, onOnline, onOffline } from './setupListeners'
 import { buildSlice } from './buildSlice'

src/query/core/module.ts

@@ -1,26 +1,22 @@
-import { reactHooksModuleName, ReactHooksBaseEndpoints } from './module'
+import { coreModule, coreModuleName } from '../core/module'
+import { buildCreateApi, CreateApi } from '../createApi'
+import { reactHooksModule, reactHooksModuleName } from './module'
 
-import { EndpointDefinitions } from '../endpointDefinitions'
+import { MutationHooks, QueryHooks } from './buildHooks'
+import {
+  EndpointDefinitions,
+  QueryDefinition,
+  MutationDefinition,
+  QueryArgFrom,
+} from '../endpointDefinitions'
 import { BaseQueryFn } from '../baseQueryTypes'
-import { TS41Hooks } from './ts41Types'
+
+import { QueryKeys } from '../core/apiState'
+import { PrefetchOptions } from '../core/module'
 
 export * from '..'
 export { ApiProvider } from './ApiProvider'
 
-export { createApi } from './reactHooksCommonExports'
-export * from './reactHooksCommonExports'
+const createApi = buildCreateApi(coreModule(), reactHooksModule())
 
-declare module '../apiTypes' {
-  export interface ApiModules<
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    BaseQuery extends BaseQueryFn,
-    Definitions extends EndpointDefinitions,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    ReducerPath extends string,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    TagTypes extends string
-  > {
-    [reactHooksModuleName]: ReactHooksBaseEndpoints<Definitions> &
-      TS41Hooks<Definitions>
-  }
-}
+export { createApi, reactHooksModule }