feat: Add ESM support for common and common-client (rollup) (#604)

.gitignore

@@ -21,3 +21,4 @@ yarn-error.log
 .vscode
 dump.rdb
 .wrangler
+stats.html

packages/sdk/browser/contract-tests/entity/src/ClientEntity.ts

@@ -156,9 +156,7 @@ export class ClientEntity {
         if (!identifyParams) {
           throw malformedCommand;
         }
-        await this.client.identify(identifyParams.user || identifyParams.context, {
-          waitForNetworkResults: true,
-        });
+        await this.client.identify(identifyParams.user || identifyParams.context);
         return undefined;
       }
 
@@ -204,7 +202,7 @@ export async function newSdkClientEntity(options: CreateInstanceParams) {
   let failed = false;
   try {
     await Promise.race([
-      client.identify(initialContext, { waitForNetworkResults: true }),
+      client.identify(initialContext),
       new Promise((_resolve, reject) => {
         setTimeout(reject, timeout);
       }),

packages/sdk/browser/jest.config.js

@@ -3,9 +3,6 @@ export default {
   verbose: true,
   preset: 'ts-jest/presets/default-esm',
   testEnvironment: 'jest-environment-jsdom',
-  transform: {
-    '^.+\\.tsx?$': ['ts-jest', { useESM: true, tsconfig: 'tsconfig.json' }],
-  },
   testPathIgnorePatterns: ['./dist', './src'],
   testMatch: ['**.test.ts'],
 };

packages/sdk/browser/package.json

@@ -36,7 +36,8 @@
   },
   "dependencies": {
     "@launchdarkly/js-client-sdk-common": "1.8.0",
-    "escape-string-regexp": "^5.0.0"
+    "escape-string-regexp": "^5.0.0",
+    "rollup-plugin-visualizer": "^5.12.0"
   },
   "devDependencies": {
     "@jest/globals": "^29.7.0",

packages/sdk/browser/rollup.config.js

@@ -3,6 +3,7 @@ import json from '@rollup/plugin-json';
 import resolve from '@rollup/plugin-node-resolve';
 import terser from '@rollup/plugin-terser';
 import typescript from '@rollup/plugin-typescript';
+import { visualizer } from 'rollup-plugin-visualizer';
 
 const getSharedConfig = (format, file) => ({
   input: 'src/index.ts',
@@ -34,6 +35,8 @@ export default [
       resolve(),
       terser(),
       json(),
+      // The 'sourcemap' option allows using the minified size, not the size before minification.
+      visualizer({ sourcemap: true }),
     ],
   },
   {

packages/sdk/browser/src/BrowserClient.ts

@@ -10,10 +10,10 @@ import {
   LDClientImpl,
   LDContext,
   LDEmitter,
+  LDEmitterEventName,
   LDHeaders,
   Platform,
 } from '@launchdarkly/js-client-sdk-common';
-import { EventName } from '@launchdarkly/js-client-sdk-common/dist/LDEmitter';
 
 import BrowserDataManager from './BrowserDataManager';
 import { BrowserIdentifyOptions as LDIdentifyOptions } from './BrowserIdentifyOptions';
@@ -233,12 +233,12 @@ export class BrowserClient extends LDClientImpl implements LDClient {
     browserDataManager.setAutomaticStreamingState(!!this.emitter.listenerCount('change'));
   }
 
-  override on(eventName: EventName, listener: Function): void {
+  override on(eventName: LDEmitterEventName, listener: Function): void {
     super.on(eventName, listener);
     this.updateAutomaticStreamingState();
   }
 
-  override off(eventName: EventName, listener: Function): void {
+  override off(eventName: LDEmitterEventName, listener: Function): void {
     super.off(eventName, listener);
     this.updateAutomaticStreamingState();
   }

packages/sdk/browser/src/goals/GoalTracker.ts

@@ -73,7 +73,7 @@ export default class GoalTracker {
     );
 
     const pageviewGoals = goalsMatchingUrl.filter((goal) => goal.kind === 'pageview');
-    const clickGoals = goalsMatchingUrl.filter((goal) => goal.kind === 'click');
+    const clickGoals = goalsMatchingUrl.filter((goal) => goal.kind === 'click') as ClickGoal[];
 
     pageviewGoals.forEach((event) => onEvent(event));
 

packages/sdk/browser/tsconfig.json

@@ -3,9 +3,8 @@
     "allowSyntheticDefaultImports": true,
     "declaration": true,
     "declarationMap": true,
-    "jsx": "react-jsx",
     "lib": ["ES2017", "dom"],
-    "module": "ES6",
+    "module": "ESNext",
     "moduleResolution": "node",
     "noImplicitOverride": true,
     "resolveJsonModule": true,

packages/shared/common/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@launchdarkly/js-sdk-common",
   "version": "2.9.0",
-  "type": "commonjs",
-  "main": "./dist/index.js",
+  "type": "module",
+  "main": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "homepage": "https://github.com/launchdarkly/js-core/tree/main/packages/shared/common",
   "repository": {
@@ -18,18 +18,27 @@
     "analytics",
     "client"
   ],
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "require": "./dist/index.cjs",
+    "import": "./dist/index.mjs"
+  },
   "scripts": {
     "test": "npx jest --ci",
-    "build-types": "npx tsc --declaration true --emitDeclarationOnly true --declarationDir dist",
-    "build": "npx tsc",
-    "clean": "npx tsc --build --clean",
+    "build": "npx tsc --noEmit && rollup -c rollup.config.js",
+    "clean": "rimraf dist",
     "lint": "npx eslint . --ext .ts",
     "lint:fix": "yarn run lint --fix",
     "prettier": "prettier --write 'src/*.@(js|ts|tsx|json)'",
     "check": "yarn && yarn prettier && yarn lint && tsc && yarn test"
   },
   "license": "Apache-2.0",
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^25.0.0",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.0.2",
+    "@rollup/plugin-terser": "^0.4.3",
+    "@rollup/plugin-typescript": "^11.1.1",
     "@trivago/prettier-plugin-sort-imports": "^4.1.1",
     "@types/jest": "^29.4.0",
     "@typescript-eslint/eslint-plugin": "^6.20.0",
@@ -44,7 +53,10 @@
     "jest": "^29.5.0",
     "launchdarkly-js-test-helpers": "^2.2.0",
     "prettier": "^3.0.0",
+    "rimraf": "6.0.1",
+    "rollup": "^3.23.0",
     "ts-jest": "^29.0.5",
+    "tslib": "^2.7.0",
     "typedoc": "0.25.0",
     "typescript": "5.1.6"
   }

packages/shared/common/rollup.config.js

@@ -1,9 +1,12 @@
 import common from '@rollup/plugin-commonjs';
 import json from '@rollup/plugin-json';
-import resolve from '@rollup/plugin-node-resolve';
-import terser from '@rollup/plugin-terser';
 import typescript from '@rollup/plugin-typescript';
 
+// The common library does not have a dependency resolution plugin as it should not have any
+// dependencies.
+
+// This library is not minified as the final SDK package is responsible for minification.
+
 const getSharedConfig = (format, file) => ({
   input: 'src/index.ts',
   output: [
@@ -13,31 +16,26 @@ const getSharedConfig = (format, file) => ({
       file: file,
     },
   ],
-  onwarn: (warning) => {
-    if (warning.code !== 'CIRCULAR_DEPENDENCY') {
-      console.error(`(!) ${warning.message}`);
-    }
-  },
 });
 
 export default [
   {
-    ...getSharedConfig('es', 'dist/index.es.js'),
+    ...getSharedConfig('es', 'dist/index.mjs'),
     plugins: [
       typescript({
         module: 'esnext',
+        tsconfig: './tsconfig.json',
+        outputToFilesystem: true,
       }),
       common({
         transformMixedEsModules: true,
         esmExternals: true,
       }),
-      resolve(),
-      terser(),
       json(),
     ],
   },
   {
-    ...getSharedConfig('cjs', 'dist/index.cjs.js'),
-    plugins: [typescript(), common(), resolve(), terser(), json()],
+    ...getSharedConfig('cjs', 'dist/index.cjs'),
+    plugins: [typescript({ tsconfig: './tsconfig.json' }), common(), json()],
   },
 ];

packages/shared/common/tsconfig.json

@@ -2,9 +2,10 @@
   "compilerOptions": {
     "rootDir": "src",
     "outDir": "dist",
-    "target": "ES2017",
+    "target": "ES2020",
     "lib": ["es6"],
-    "module": "commonjs",
+    "module": "ESNext",
+    "moduleResolution": "node",
     "strict": true,
     "noImplicitOverride": true,
     // Needed for CommonJS modules: markdown-it, fs-extra
@@ -15,5 +16,6 @@
     "stripInternal": true,
     "composite": true
   },
+  "include": ["src"],
   "exclude": ["**/*.test.ts", "dist", "node_modules", "__tests__"]
 }

packages/shared/sdk-client/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@launchdarkly/js-client-sdk-common",
   "version": "1.8.0",
-  "type": "commonjs",
-  "main": "./dist/index.js",
+  "type": "module",
+  "main": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "homepage": "https://github.com/launchdarkly/js-core/tree/main/packages/shared/sdk-client",
   "repository": {
@@ -18,11 +18,16 @@
     "analytics",
     "client"
   ],
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "require": "./dist/index.cjs",
+    "import": "./dist/index.mjs"
+  },
   "scripts": {
     "doc": "../../../scripts/build-doc.sh .",
     "test": "npx jest --ci",
-    "build": "npx tsc",
-    "clean": "npx tsc --build --clean",
+    "build": "tsc --noEmit && rollup -c rollup.config.js",
+    "clean": "rimraf dist",
     "lint": "npx eslint . --ext .ts",
     "lint:fix": "yarn run lint -- --fix",
     "prettier": "prettier --write 'src/*.@(js|ts|tsx|json)'",
@@ -33,6 +38,11 @@
     "@launchdarkly/js-sdk-common": "2.9.0"
   },
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^25.0.0",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.0.2",
+    "@rollup/plugin-terser": "^0.4.3",
+    "@rollup/plugin-typescript": "^11.1.1",
     "@testing-library/dom": "^9.3.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@types/jest": "^29.5.3",
@@ -51,6 +61,8 @@
     "jest-environment-jsdom": "^29.6.1",
     "launchdarkly-js-test-helpers": "^2.2.0",
     "prettier": "^3.0.0",
+    "rimraf": "6.0.1",
+    "rollup": "^3.23.0",
     "ts-jest": "^29.1.1",
     "typedoc": "0.25.0",
     "typescript": "5.1.6"

packages/shared/sdk-client/rollup.config.js

@@ -1,43 +1,43 @@
 import common from '@rollup/plugin-commonjs';
 import json from '@rollup/plugin-json';
 import resolve from '@rollup/plugin-node-resolve';
-import terser from '@rollup/plugin-terser';
 import typescript from '@rollup/plugin-typescript';
 
+// This library is not minified as the final SDK package is responsible for minification.
+
 const getSharedConfig = (format, file) => ({
   input: 'src/index.ts',
+  // Intermediate modules don't bundle all dependencies. We leave that to leaf-node
+  // SDK implementations.
+  external: ['@launchdarkly/js-sdk-common'],
   output: [
     {
       format: format,
       sourcemap: true,
       file: file,
     },
   ],
-  onwarn: (warning) => {
-    if (warning.code !== 'CIRCULAR_DEPENDENCY') {
-      console.error(`(!) ${warning.message}`);
-    }
-  },
 });
 
 export default [
   {
-    ...getSharedConfig('es', 'dist/index.es.js'),
+    ...getSharedConfig('es', 'dist/index.mjs'),
     plugins: [
       typescript({
         module: 'esnext',
+        tsconfig: './tsconfig.json',
+        outputToFilesystem: true,
       }),
       common({
         transformMixedEsModules: true,
         esmExternals: true,
       }),
       resolve(),
-      terser(),
       json(),
     ],
   },
   {
-    ...getSharedConfig('cjs', 'dist/index.cjs.js'),
-    plugins: [typescript(), common(), resolve(), terser(), json()],
+    ...getSharedConfig('cjs', 'dist/index.cjs'),
+    plugins: [typescript({ tsconfig: './tsconfig.json' }), common(), resolve(), json()],
   },
 ];

packages/shared/sdk-client/src/index.ts

@@ -2,7 +2,7 @@ import { LDClientInternalOptions } from './configuration/Configuration';
 import DataSourceStatus, { DataSourceState } from './datasource/DataSourceStatus';
 import DataSourceStatusErrorInfo from './datasource/DataSourceStatusErrorInfo';
 import LDClientImpl from './LDClientImpl';
-import LDEmitter from './LDEmitter';
+import LDEmitter, { EventName } from './LDEmitter';
 import Requestor from './polling/Requestor';
 
 export * from '@launchdarkly/js-sdk-common';
@@ -38,4 +38,5 @@ export {
   LDClientImpl,
   LDClientInternalOptions,
   DataSourceState,
+  EventName as LDEmitterEventName,
 };

packages/shared/sdk-client/tsconfig.json

@@ -2,9 +2,10 @@
   "compilerOptions": {
     "rootDir": "src",
     "outDir": "dist",
-    "target": "ES2017",
+    "target": "ES2020",
     "lib": ["es6", "DOM"],
-    "module": "commonjs",
+    "module": "ESNext",
+    "moduleResolution": "node",
     "strict": true,
     "noImplicitOverride": true,
     // Needed for CommonJS modules: markdown-it, fs-extra