feat: introduce esm and cjs support according to d3/d3#3469 (comment)

.github/workflows/release-canary.yml

@@ -21,8 +21,8 @@ jobs:
       - name: Install dependencies
         if: steps.cache-modules.outputs.cache-hit != 'true'
         run: yarn
-      - name: Compile TypeScript
-        run: yarn tsc
+      - name: Build
+        run: yarn build
       - name: Configure Git Credentials
         run: |
           git config --global user.email "github-action@users.noreply.github.com"

package.json

@@ -1,8 +1,22 @@
 {
   "name": "gqtx",
   "version": "0.8.0",
-  "main": "dist/index.js",
+  "type": "module",
+  "main": "dist/cjs/index.js",
+  "module": "dist/index.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/cjs/index.js"
+    },
+    "./relay": {
+      "import": "./dist/relay.js",
+      "require": "./dist/cjs/relay.js"
+    },
+    "./package.json": "./package.json",
+    "./": "./"
+  },
   "files": [
     "/dist"
   ],
@@ -17,17 +31,23 @@
     "graphql-server"
   ],
   "devDependencies": {
+    "@rollup/plugin-typescript": "^8.2.0",
     "@types/express": "^4.17.1",
     "express": "^4.17.1",
     "express-graphql": "^0.9.0",
     "graphql": "^15.1.0",
+    "rollup": "^2.39.0",
     "ts-node": "^8.4.1",
-    "typescript": "^3.6.4"
+    "tslib": "^2.1.0",
+    "typescript": "^4.1.5"
   },
   "peerDependencies": {
     "graphql": "^15.1.0"
   },
   "scripts": {
-    "prepare": "tsc"
+    "prepare": "yarn build",
+    "build:cjs": "MODE=cjs rollup -c",
+    "build:esm": "rollup -c",
+    "build": "yarn build:cjs && yarn build:esm"
   }
 }

rollup.config.js

@@ -0,0 +1,27 @@
+import ts from '@rollup/plugin-typescript'
+import { promises as fs } from "fs"
+
+const isCJSBuild = process.env.MODE === "cjs" 
+
+const commonjsPkgJSONPlugin = () => {
+  return {
+    name: 'commonjsPkgJSONPlugin',
+    write: async  () => {
+      await fs.writeFile("dist/cjs/package.json", JSON.stringify({
+        "type": "commonjs"
+      }))
+    }
+  }
+}
+
+export default {
+  input: ['src/index.ts', 'src/relay.ts'],
+  output: [
+    {
+      dir: isCJSBuild ? 'dist/cjs' : 'dist',
+      format: isCJSBuild ? 'cjs' : 'esm'
+    }
+  ],
+  plugins: [ts({ tsconfig: isCJSBuild ? "tsconfig.cjs.json" : "tsconfig.json" }), isCJSBuild ? commonjsPkgJSONPlugin() : undefined].filter(Boolean),
+  external: ["graphql"]
+}

tsconfig.cjs.json

@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "dist/cjs",
+    "declaration": false
+  }
+}

tsconfig.json

@@ -1,25 +1,21 @@
 {
   "compilerOptions": {
-    "incremental": true,                   /* Enable incremental compilation */
-    "target": "es2019",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
-    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
-    "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+    "target": "ES2019",
+    "module": "ESNext",
+    "moduleResolution": "node",
     "rootDir": "src",
-    "outDir": "dist",                        /* Redirect output structure to the directory. */
+    "outDir": "dist",
     "declaration": true,
     /* Strict Type-Checking Options */
-    "strict": true,                           /* Enable all strict type-checking options. */
-    "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
-    "noImplicitThis": true,                /* Raise error on 'this' expressions with an implied 'any' type. */
-    "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
-
+    "strict": true,
+    "noImplicitAny": true,
+    "noImplicitThis": true,
+    "alwaysStrict": true,
     /* Additional Checks */
-    "noUnusedLocals": true,                /* Report errors on unused locals. */
-    "noUnusedParameters": true,            /* Report errors on unused parameters. */
-    // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
-    "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
-    "esModuleInterop": true,                   /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
-    "emitDeclarationOnly": true
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
   },
   "files": ["./src/index.ts", "./src/relay.ts"]
 }