build: Distribute CommonJS for projects that cannot use ESM

Signed-off-by: Kenny Elshoff <[email protected]>
cloudinary · Oct 4, 2021 · fac8e83 · fac8e83
1 parent 865c3ed
commit fac8e83
Show file tree

Hide file tree

Showing 10 changed files with 109 additions and 48 deletions.
diff --git a/jest.config.json b/jest.config.json
@@ -2,7 +2,7 @@
   "preset": "ts-jest",
   "testEnvironment": "jsdom",
   "bail": true,
-  "resolver": "<rootDir>/src/internal/utils/jest-ts-resolver.js",
+  "resolver": "<rootDir>/src/internal/utils/jest-ts-resolver.cjs",
   "collectCoverageFrom": [
     "<rootDir>/src/**/*.ts",
     "<rootDir>/scripts/**/*.ts",
@@ -27,7 +27,7 @@
       "diagnostics": false
     }
   },
-  "reporters": [
+    "reporters": [
     "default",
     ["jest-html-reporters", {
       "publicPath" : "./public/progress/",

diff --git a/package.json b/package.json
@@ -11,8 +11,8 @@
     "test:unit:watch": "jest --watch --reporters default",
     "build": "bash ./scripts/build.sh",
     "test:types": "tsc --project tsconfig.test.json",
-    "build:ESM": "tsc --project tsconfig.json",
-    "build:UMD": "rollup -c",
+    "build:ESM": "tsc --project tsconfig.json --outDir dist --declaration true",
+    "build:rollup": "rollup -c",
     "build:docs": "node ./scripts/buildDocs.js",
     "build:entryPoints": "ts-node ./scripts/createEntrypoints.ts",
     "build:injectPackageVersion": "ts-node ./scripts/injectPackageVersionToDistFiles.ts",
@@ -33,9 +33,12 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@release-it/bumper": "^2.0.0",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-commonjs": "^21.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^7.1.1",
     "@rollup/plugin-replace": "^3.0.0",
+    "@rollup/plugin-typescript": "^8.2.5",
     "@types/jest": "^25.2.3",
     "@types/mock-fs": "^4.10.0",
     "@types/node": "^15.14.2",
@@ -75,10 +78,8 @@
     "replace-in-file": "^6.2.0",
     "rimraf": "^3.0.2",
     "rollup": "^2.57.0",
-    "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-commonjs": "^10.1.0",
+    "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-serve": "^1.0.1",
-    "rollup-plugin-typescript": "^1.0.1",
     "sanitize-html": "^1.18.2",
     "ts-jest": "^26.0.0",
     "ts-node": "^8.10.2",
@@ -94,20 +95,50 @@
   "exports": {
     "./bundles/umd/package.json": "./bundles/umd/package.json",
     "./package.json": "./package.json",
-    "./actions/*": "./actions/*.js",
-    "./assets/*": "./assets/*.js",
-    "./backwards/*": "./backwards/*.js",
-    "./bundles/*": "./bundles/*.js",
-    "./config/*": "./config/*.js",
-    "./instance/*": "./instance/*.js",
-    "./qualifiers/*": "./qualifiers/*.js",
-    "./sdkAnalytics/*": "./sdkAnalytics/*.js",
-    "./transformation/*": "./transformation/*.js",
-    "./types/*": "./types/*.js",
+    "./actions/*": {
+      "require": "./actions/*.cjs",
+      "import": "./actions/*.js"
+    },
+    "./assets/*": {
+      "require": "./assets/*.cjs",
+      "import": "./assets/*.js"
+    },
+    "./backwards/*": {
+      "require": "./backwards/*.cjs",
+      "import": "./backwards/*.js"
+    },
+    "./bundles/*": {
+      "require": "./bundles/*.cjs",
+      "import": "./bundles/*.js"
+    },
+    "./config/*": {
+      "require": "./config/*.cjs",
+      "import": "./config/*.js"
+    },
+    "./instance/*": {
+      "require": "./instance/*.cjs",
+      "import": "./instance/*.js"
+    },
+    "./qualifiers/*": {
+      "require": "./qualifiers/*.cjs",
+      "import": "./qualifiers/*.js"
+    },
+    "./sdkAnalytics/*": {
+      "require": "./sdkAnalytics/*.cjs",
+      "import": "./sdkAnalytics/*.js"
+    },
+    "./transformation/*": {
+      "require": "./transformation/*.cjs",
+      "import": "./transformation/*.js"
+    },
+    "./types/*": {
+      "require": "./types/*.cjs",
+      "import": "./types/*.js"
+    },
     ".": {
       "node": "./index.js",
       "require": "./bundles/umd/base.js",
       "default": "./index.js"
     }
   }
-}
+}
diff --git a/rollup.config.js b/rollup.config.js
@@ -1,27 +1,50 @@
 import resolve from '@rollup/plugin-node-resolve';
-import typescript from 'rollup-plugin-typescript';
+import typescript from '@rollup/plugin-typescript';
 import json from '@rollup/plugin-json';
-import commonjs from 'rollup-plugin-commonjs';
+import commonjs from '@rollup/plugin-commonjs';
 import replace from '@rollup/plugin-replace';
+import multi from 'rollup-plugin-multi-input';
 import {version} from './package.json';
 
-export default [{
-  input: 'src/index.ts',
-  output: [
-    {
-      file: 'dist/bundles/umd/base.js',
-      format: 'umd',
-      name:'CloudinaryBaseSDK'
-    }
-  ],
-  plugins: [
-    json(),
-    resolve(),
-    replace({
-      'PACKAGE_VERSION_INJECTED_DURING_BUILD': version
-    }),
-    typescript({ target: "es5"}),
-    commonjs()
-  ]
-}];
+export default [
+  {
+    input: 'src/index.ts',
+    output: [
+      {
+        file: 'dist/bundles/umd/base.js',
+        format: 'umd',
+        name: 'CloudinaryBaseSDK',
+      },
+    ],
+    plugins: [
+      json(),
+      resolve(),
+      replace({
+        'PACKAGE_VERSION_INJECTED_DURING_BUILD': version,
+      }),
+      typescript({ target: 'es5' }),
+      commonjs(),
+    ],
+  },
+  {
+    input: 'src/**/*.ts',
+    output: {
+      format: 'cjs',
+      dir: 'dist',
+      entryFileNames: '[name].cjs',
+      chunkFileNames: '[name]-[hash].cjs',
+      exports: 'auto',
+    },
+    plugins: [
+      multi(),
+      json(),
+      resolve(),
+      replace({
+        'PACKAGE_VERSION_INJECTED_DURING_BUILD': version,
+      }),
+      typescript({ target: "es5" }),
+      commonjs()
+    ]
+  }
+];
 
diff --git a/rollup.dev.config.js b/rollup.dev.config.js
@@ -1,7 +1,7 @@
 import resolve from '@rollup/plugin-node-resolve';
-import babel from 'rollup-plugin-babel';
+import babel from '@rollup/plugin-babel';
 import serve from 'rollup-plugin-serve';
-import typescript from "rollup-plugin-typescript";
+import typescript from "@rollup/plugin-typescript";
 import json from '@rollup/plugin-json';
 import replace from '@rollup/plugin-replace';
 import {version} from './package.json';

diff --git a/scripts/build.sh b/scripts/build.sh
@@ -3,7 +3,7 @@ set -e;
 rimraf ./dist
 npm run lint
 npm run build:ESM
-npm run build:UMD
+npm run build:rollup
 npm run build:entryPoints
 npm run build:docs
 npm run build:injectPackageVersion

diff --git a/scripts/injectPackageVersionToDistFiles.ts b/scripts/injectPackageVersionToDistFiles.ts
@@ -9,7 +9,7 @@ const {resolve} = require('path');
 
 const distFolder = resolve('./dist');
 const options = {
-  files: [`${distFolder}/**/*.js`, `${distFolder}/**/*.ts`],
+  files: [`${distFolder}/**/*.js`, `${distFolder}/**/*.cjs`, `${distFolder}/**/*.ts`],
   from: /PACKAGE_VERSION_INJECTED_DURING_BUILD/g,
   to: version
 };

diff --git a/scripts/lib/entryPointsLib.ts b/scripts/lib/entryPointsLib.ts
@@ -39,6 +39,7 @@ function copyPackageJson(fileDestination = 'dist') {
   projectJson.main = './bundles/umd/base.js';
   projectJson.browser = './index.js';
   projectJson.module = './index.js';
+  projectJson.type = 'module',
 
   Object.assign(projectJson, commonPackageProperties);
   fs.writeFileSync(`./${fileDestination}/package.json`, JSON.stringify(projectJson, null, '\t'));

diff --git a/scripts/updatePackageJsonExports.ts b/scripts/updatePackageJsonExports.ts
@@ -27,9 +27,17 @@ const distSubDirectoriesArray: string[] = readdirSync(resolve('./dist'), {withFi
   // Sort alphabetically
   .sort();
 
-// Convert directory string to object of {[directory/*]: directory/*.js}
-const distSubDirectoriesObj: Record<string, string> = distSubDirectoriesArray
-  .reduce((obj, dir) => ({...obj, ...{[`${dir}/*`]: `${dir}/*.js`}}), {}); //
+// Convert directory string to object of {[./directory/*]: { require: "directory/*.mjs", import: "directory/*.js" }}
+const distSubDirectoriesObj: Record<
+  string,
+  Record<string, string>
+> = distSubDirectoriesArray.reduce(
+  (obj, dir) => ({
+    ...obj,
+    ...{ [`${dir}/*`]: { require: `${dir}/*.cjs`, import: `${dir}/*.js` } },
+  }),
+  {}
+);
 
 // Generate updated package json object
 const resultPackageJson = JSON.stringify({

diff --git a/src/internal/utils/jest-ts-resolver.js → src/internal/utils/jest-ts-resolver.cjs b/src/internal/utils/jest-ts-resolver.js → src/internal/utils/jest-ts-resolver.cjs
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,9 +1,7 @@
 {
   "compilerOptions": {
     "noImplicitAny": true,
-    "outDir": "./dist",
     "target": "ES2015",
-    "declaration": true,
     "module": "ES2015",
     "moduleResolution": "node",
     "baseUrl": "src",