Build ESM client-side modules to enable tree shaking

TypeScript compiler needs to be configured to output ES6 module by
setting --module es6 or the equivalent tsconfig.json compilerOptions
parameter.

Since tsc --build does not accept compiler options flags, we need to
duplicate some of the configuration:

- specify separate output folder for ES6 module files (new
  tsconfig.esm.json file)
- add "module" field for ES6 module (esm) output files to package.json

Hence, a script `scripts/sync-esm-config.js` was added to automate this
process.

.gitignore

@@ -61,3 +61,4 @@ typings/
 build/
 data/
 packages/*/lib
+packages/*/esm

Buildfile

@@ -11,5 +11,8 @@ add:
 clean:
   rm -rf packages/*/lib
 
+sync-esm-config:
+  node scripts/sync-esm-config.js
+
 test:
   jest

package-lock.json

@@ -5427,9 +5427,8 @@
       }
     },
     "esmify": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/esmify/-/esmify-2.1.1.tgz",
-      "integrity": "sha512-GyOVgjG7sNyYB5Mbo15Ll4aGrcXZzZ3LI22rbLOjCI7L/wYelzQpBHRZkZkqbPNZ/QIRilcaHqzgNCLcEsi1lQ==",
+      "version": "git+https://github.com/jeremija/esmify.git#f98b2c83898283cb01346635ef457e33795d7060",
+      "from": "git+https://github.com/jeremija/esmify.git",
       "dev": true,
       "requires": {
         "@babel/core": "^7.2.2",

package.json

@@ -44,7 +44,7 @@
     "cookie-parser": "^1.4.4",
     "date-fns": "^2.0.0-alpha.27",
     "deep-object-diff": "^1.1.0",
-    "esmify": "^2.1.1",
+    "esmify": "git+https://github.com/jeremija/esmify.git",
     "history": "^4.9.0",
     "jest": "^24.5.0",
     "lerna": "^3.13.1",
@@ -60,13 +60,12 @@
     "react-dom": "^16.7.0",
     "react-icons": "^3.5.0",
     "react-redux": "^6.0.0",
-    "react-router-dom": "^4.4.0",
+    "react-router-dom": "^4.3.1",
     "redux": "^4.0.1",
     "sanitize-html": "^1.20.0",
     "sourceify": "git+https://github.com/jeremija/sourceify.git#sources-content",
     "std-mocks": "^1.0.1",
     "supertest": "^3.3.0",
-    "terser": "^3.14.1",
     "ts-jest": "^24.0.0",
     "ts-node": "^7.0.1",
     "ts-node-dev": "^1.0.0-pre.32",

packages/client/package.json

@@ -9,5 +9,6 @@
     "redux": "^4.0.1"
   },
   "main": "lib/index.js",
-  "types": "lib/index.d.ts"
+  "types": "lib/index.d.ts",
+  "module": "esm/index.js"
 }

packages/client/tsconfig.esm.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "esm"
+  },
+  "references": [
+    {
+      "path": "../common/tsconfig.esm.json"
+    }
+  ]
+}

packages/common/package.json

@@ -2,5 +2,6 @@
   "name": "@rondo/common",
   "private": true,
   "main": "lib/index.js",
+  "module": "esm/index.js",
   "types": "lib/index.d.ts"
-}
+}

packages/common/tsconfig.esm.json

@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "esm"
+  },
+  "references": []
+}

packages/server/package.json

@@ -34,5 +34,6 @@
     "winston": "^3.1.0"
   },
   "main": "lib/index.js",
-  "types": "lib/index.d.ts"
-}
+  "types": "lib/index.d.ts",
+  "module": "esm/index.js"
+}

packages/server/tsconfig.esm.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "esm"
+  },
+  "references": [
+    {
+      "path": "../common/tsconfig.esm.json"
+    }
+  ]
+}

scripts/sync-esm-config.js

@@ -0,0 +1,47 @@
+#!/usr/bin/env node
+const fs = require('fs')
+const path = require('path')
+
+const TSCONFIG_FILENAME = 'tsconfig.json'
+const TSCONFIG_ESM_FILENAME = 'tsconfig.esm.json'
+const PKG_DIRNAME = 'packages'
+
+const projectRoot = path.relative(
+  process.cwd(), path.resolve(__dirname, '..'))
+const pkgDir = path.join(projectRoot, PKG_DIRNAME)
+
+const projects = fs.readdirSync(pkgDir)
+.filter(file => {
+  const stat = fs.lstatSync(path.join(pkgDir, file))
+  return stat.isDirectory()
+})
+.map(file => path.join(pkgDir, file, TSCONFIG_FILENAME))
+.filter(file => fs.existsSync(file))
+.forEach(file => {
+  const tsconfig = JSON.parse(fs.readFileSync(file, 'utf8'))
+  const references = (tsconfig.references || [])
+  .map(ref => ({
+    ...ref,
+    path: path.join(ref.path, TSCONFIG_ESM_FILENAME),
+  }))
+
+  const tsconfigEsm = {
+    extends: `./${TSCONFIG_FILENAME}`,
+    compilerOptions: {
+      "outDir": "esm",
+    },
+    references,
+  }
+
+  const dirname = path.dirname(file)
+  const esmFile = path.join(dirname, TSCONFIG_ESM_FILENAME)
+  console.log('Writing %s', esmFile)
+  fs.writeFileSync(esmFile, JSON.stringify(tsconfigEsm, null, '  '))
+
+  const pkgFile = path.join(dirname, 'package.json')
+  const pkg = JSON.parse(fs.readFileSync(pkgFile, 'utf8'))
+  pkg.module = 'lib/index.js'
+  pkg.module = pkg.main ? pkg.main.replace(/^lib/, 'esm') : 'lib/index.js'
+  console.log('Writing %s', pkgFile)
+  fs.writeFileSync(pkgFile, JSON.stringify(pkg, null, '  '))
+})