Migrate to Node16 resolution (#186)

Updating everything to use node16 resolutions. This guarantees (via the tsc compiler) that the files we output match the expected import format for downstream tools. This also brings us into compliance with module resolution for node 16+, which is the minimum version of node we support and is the recommended value for libraries. See detailed explanation [here](https://www.typescriptlang.org/docs/handbook/esm-node.html)
connectrpc · Mar 25, 2024 · 865cd1c · 865cd1c
1 parent f73710f
commit 865cd1c
Show file tree

Hide file tree

Showing 18 changed files with 70 additions and 50 deletions.
diff --git a/cspell.config.json b/cspell.config.json
@@ -37,6 +37,7 @@
     "corepack",
     "printables",
     "arethetypeswrong",
+    "oneof",
     "typesafe"
   ],
   "ignorePaths": ["**/*.svg", "**/*.ai", "**/pnpm-lock.yaml", "*.excalidraw"]

diff --git a/jest-preset.js b/jest-preset.js
@@ -32,7 +32,7 @@ module.exports = {
   },
   workerThreads: true, // Enabled so jest would stop complaining about serializing BigInt.  See https://github.com/jestjs/jest/issues/11617#issuecomment-1458155552 for details
   transform: {
-    "^.+\\.(ts|tsx)$": [
+    "^.+\\.(ts|tsx|js)$": [
       "ts-jest",
       {
         isolatedModules: false,

diff --git a/packages/connect-query/package.json b/packages/connect-query/package.json
@@ -11,8 +11,8 @@
   "scripts": {
     "clean": "rm -rf ./dist/*",
     "build": "npm run build:cjs && npm run build:esm",
-    "build:cjs": "tsc --project tsconfig.build.json --module commonjs --outDir ./dist/cjs --declaration --declarationDir ./dist/cjs && echo >./dist/cjs/package.json '{\"type\":\"commonjs\"}'",
-    "build:esm": "tsc --project tsconfig.build.json --module ES2015 --verbatimModuleSyntax --outDir ./dist/esm --declaration --declarationDir ./dist/esm",
+    "build:cjs": "tsc --project tsconfig.build.json --module commonjs --moduleResolution node10 --verbatimModuleSyntax false --outDir ./dist/cjs --declarationDir ./dist/cjs && echo >./dist/cjs/package.json '{\"type\":\"commonjs\"}'",
+    "build:esm": "tsc --project tsconfig.build.json",
     "generate": "buf generate --path eliza.proto",
     "test": "jest",
     "format": "prettier . --write --ignore-path ./.eslintignore && eslint . --fix && license-header",

diff --git a/packages/connect-query/src/call-unary-method.test.ts b/packages/connect-query/src/call-unary-method.test.ts
@@ -17,13 +17,13 @@ import type { QueryFunctionContext } from "@tanstack/react-query";
 import { useQueries } from "@tanstack/react-query";
 import { renderHook, waitFor } from "@testing-library/react";
 
-import { callUnaryMethod } from "./call-unary-method";
-import type { ConnectQueryKey } from "./connect-query-key";
-import { createConnectQueryKey } from "./connect-query-key";
-import { defaultOptions } from "./default-options";
-import { ElizaService } from "./gen/eliza_connect";
-import type { SayRequest } from "./gen/eliza_pb";
-import { mockEliza, wrapper } from "./jest/test-utils";
+import { callUnaryMethod } from "./call-unary-method.js";
+import type { ConnectQueryKey } from "./connect-query-key.js";
+import { createConnectQueryKey } from "./connect-query-key.js";
+import { defaultOptions } from "./default-options.js";
+import { ElizaService } from "./gen/eliza_connect.js";
+import type { SayRequest } from "./gen/eliza_pb.js";
+import { mockEliza, wrapper } from "./jest/test-utils.js";
 
 const sayMethodDescriptor = {
   ...ElizaService.methods.say,

diff --git a/packages/connect-query/src/connect-query-key.test.ts b/packages/connect-query/src/connect-query-key.test.ts
@@ -14,9 +14,9 @@
 
 import { describe, expect, it } from "@jest/globals";
 
-import { createConnectQueryKey } from "./connect-query-key";
-import { SayRequest } from "./gen/eliza_pb";
-import { disableQuery } from "./utils";
+import { createConnectQueryKey } from "./connect-query-key.js";
+import { SayRequest } from "./gen/eliza_pb.js";
+import { disableQuery } from "./utils.js";
 
 describe("makeQueryKey", () => {
   const methodDescriptor = {

diff --git a/packages/connect-query/src/default-options.test.ts b/packages/connect-query/src/default-options.test.ts
@@ -14,7 +14,7 @@
 
 import { describe, expect, it } from "@jest/globals";
 
-import { defaultOptions } from "./default-options";
+import { defaultOptions } from "./default-options.js";
 
 describe("defaultOptions", () => {
   const {

diff --git a/packages/connect-query/src/default-options.ts b/packages/connect-query/src/default-options.ts
@@ -26,6 +26,7 @@ import stableHash from "stable-hash";
  */
 export const defaultOptions = {
   queries: {
-    queryKeyHashFn: stableHash,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- stableHash is a function but doesn't seem to satisfy the type. Likely a node16 compat problem.
+    queryKeyHashFn: stableHash as any as (object: any) => string,
   },
 } satisfies DefaultOptions;
diff --git a/packages/connect-query/src/jest/test-utils.tsx b/packages/connect-query/src/jest/test-utils.tsx
@@ -24,10 +24,14 @@ import {
   BigIntService,
   ElizaService,
   PaginatedService,
-} from "../gen/eliza_connect";
-import type { CountRequest, ListResponse, SayRequest } from "../gen/eliza_pb";
-import { CountResponse, SayResponse } from "../gen/eliza_pb";
-import { TransportProvider } from "../use-transport";
+} from "../gen/eliza_connect.js";
+import type {
+  CountRequest,
+  ListResponse,
+  SayRequest,
+} from "../gen/eliza_pb.js";
+import { CountResponse, SayResponse } from "../gen/eliza_pb.js";
+import { TransportProvider } from "../use-transport.js";
 
 /**
  * A utils wrapper that supplies Tanstack Query's `QueryClientProvider` as well as Connect-Query's `TransportProvider`.

diff --git a/packages/connect-query/src/use-infinite-query.test.ts b/packages/connect-query/src/use-infinite-query.test.ts
@@ -19,16 +19,16 @@ import { renderHook, waitFor } from "@testing-library/react";
 import {
   createConnectInfiniteQueryKey,
   createConnectQueryKey,
-} from "./connect-query-key";
-import { defaultOptions } from "./default-options";
-import { PaginatedService } from "./gen/eliza_connect";
-import { mockPaginatedTransport, wrapper } from "./jest/test-utils";
+} from "./connect-query-key.js";
+import { defaultOptions } from "./default-options.js";
+import { PaginatedService } from "./gen/eliza_connect.js";
+import { mockPaginatedTransport, wrapper } from "./jest/test-utils.js";
 import {
   useInfiniteQuery,
   useSuspenseInfiniteQuery,
-} from "./use-infinite-query";
-import { useQuery } from "./use-query";
-import { disableQuery } from "./utils";
+} from "./use-infinite-query.js";
+import { useQuery } from "./use-query.js";
+import { disableQuery } from "./utils.js";
 
 // TODO: maybe create a helper to take a service and method and generate this.
 const methodDescriptor = {

diff --git a/packages/connect-query/src/use-mutation.test.ts b/packages/connect-query/src/use-mutation.test.ts
@@ -15,14 +15,14 @@
 import { describe, expect, it, jest } from "@jest/globals";
 import { renderHook, waitFor } from "@testing-library/react";
 
-import { defaultOptions } from "./default-options";
-import { BigIntService, PaginatedService } from "./gen/eliza_connect";
+import { defaultOptions } from "./default-options.js";
+import { BigIntService, PaginatedService } from "./gen/eliza_connect.js";
 import {
   mockPaginatedTransport,
   mockStatefulBigIntTransport,
   wrapper,
-} from "./jest/test-utils";
-import { useMutation } from "./use-mutation";
+} from "./jest/test-utils.js";
+import { useMutation } from "./use-mutation.js";
 
 // TODO: maybe create a helper to take a service and method and generate this.
 const methodDescriptor = {

diff --git a/packages/connect-query/src/use-query.test.ts b/packages/connect-query/src/use-query.test.ts
@@ -15,10 +15,10 @@
 import { describe, expect, it } from "@jest/globals";
 import { renderHook, waitFor } from "@testing-library/react";
 
-import { ElizaService } from "./gen/eliza_connect";
-import { mockEliza, wrapper } from "./jest/test-utils";
-import { useQuery, useSuspenseQuery } from "./use-query";
-import { disableQuery } from "./utils";
+import { ElizaService } from "./gen/eliza_connect.js";
+import { mockEliza, wrapper } from "./jest/test-utils.js";
+import { useQuery, useSuspenseQuery } from "./use-query.js";
+import { disableQuery } from "./utils.js";
 
 // TODO: maybe create a helper to take a service and method and generate this.
 const sayMethodDescriptor = {

diff --git a/packages/connect-query/src/use-transport.test.tsx b/packages/connect-query/src/use-transport.test.tsx
@@ -16,10 +16,10 @@ import { ConnectError } from "@connectrpc/connect";
 import { describe, expect, it } from "@jest/globals";
 import { renderHook, waitFor } from "@testing-library/react";
 
-import { ElizaService } from "./gen/eliza_connect";
-import { mockBigInt, wrapper } from "./jest/test-utils";
-import { useQuery } from "./use-query";
-import { TransportProvider, useTransport } from "./use-transport";
+import { ElizaService } from "./gen/eliza_connect.js";
+import { mockBigInt, wrapper } from "./jest/test-utils.js";
+import { useQuery } from "./use-query.js";
+import { TransportProvider, useTransport } from "./use-transport.js";
 
 const sayMethodDescriptor = {
   ...ElizaService.methods.say,

diff --git a/packages/connect-query/src/utils.test.ts b/packages/connect-query/src/utils.test.ts
@@ -15,10 +15,14 @@
 import type { PartialMessage } from "@bufbuild/protobuf";
 import { describe, expect, it, jest } from "@jest/globals";
 
-import { BigIntService } from "./gen/eliza_connect";
-import type { CountResponse } from "./gen/eliza_pb";
-import type { Equal, Expect } from "./jest/test-utils";
-import { assert, createProtobufSafeUpdater, isAbortController } from "./utils";
+import { BigIntService } from "./gen/eliza_connect.js";
+import type { CountResponse } from "./gen/eliza_pb.js";
+import type { Equal, Expect } from "./jest/test-utils.js";
+import {
+  assert,
+  createProtobufSafeUpdater,
+  isAbortController,
+} from "./utils.js";
 
 describe("assert", () => {
   const message = "assertion message";

diff --git a/packages/connect-query/tsconfig.build.json b/packages/connect-query/tsconfig.build.json
@@ -1,7 +1,10 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "declaration": true,
+    "declarationDir": "./dist/esm",
+    "outDir": "./dist/esm"
   },
   "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["**/*.test.ts", "**/*.test.tsx", "src/jest/**"]

diff --git a/packages/connect-query/tsconfig.json b/packages/connect-query/tsconfig.json
@@ -3,7 +3,9 @@
   "compilerOptions": {
     "rootDir": ".",
     "noUnusedLocals": false, // necessary for TypeScript type tests, but since this is not enabled for build, unused variables have no risk of leaking into the build output
-    "lib": ["DOM", "ESNext"]
+    "lib": ["DOM", "ESNext"],
+    "noEmit": true,
+    "verbatimModuleSyntax": false
   },
   "exclude": ["coverage", "dist"],
   "include": ["src", "./*.config.ts"]

diff --git a/packages/protoc-gen-connect-query/src/protoc-gen-connect-query-plugin.ts b/packages/protoc-gen-connect-query/src/protoc-gen-connect-query-plugin.ts
@@ -15,8 +15,8 @@
 import { createEcmaScriptPlugin } from "@bufbuild/protoplugin";
 
 import { version } from "../package.json";
-import { generateDts } from "./generateDts";
-import { generateTs } from "./generateTs";
+import { generateDts } from "./generateDts.js";
+import { generateTs } from "./generateTs.js";
 
 export const protocGenConnectQuery = createEcmaScriptPlugin({
   name: "protoc-gen-connect-query",

diff --git a/packages/protoc-gen-connect-query/tsconfig.build.json b/packages/protoc-gen-connect-query/tsconfig.build.json
@@ -2,8 +2,10 @@
   "files": ["src/protoc-gen-connect-query-plugin.ts"],
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
+    "moduleResolution": "Node16",
+    "module": "Node16",
     "outDir": "dist/cjs",
-    "module": "CommonJS",
-    "resolveJsonModule": true
+    "resolveJsonModule": true,
+    "verbatimModuleSyntax": false
   }
 }
diff --git a/tsconfig.base.json b/tsconfig.base.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "allowJs": true,
     "target": "ESNext",
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
@@ -13,8 +14,10 @@
     "noFallthroughCasesInSwitch": true,
     "noImplicitOverride": true,
 
-    // We need node's module resolution, so we do not have to skip lib checks
-    "moduleResolution": "Node",
+    "verbatimModuleSyntax": true,
+    "moduleResolution": "Node16",
+    "module": "Node16",
+
     "skipLibCheck": false,
     "declaration": true,
     "declarationMap": true,