Implement better exports strategy supporting both commonjs and es6-style

Keep in mind that this commit only applies for the future v4.

We noticed that various applications bundling processes expect various
ways of packaging a library, some prefer relying on commonjs-style
exports for dependencies, other on es6-style exports.

To improve on this situation, this commit implements the following way
of providing exports:

  - Both an ES2017 build with ES6 style exports and an ES5 build with
    commonJS-style exports are generated.

    The first one is compiled in `./dist/es2017`, the second one in
    `./dist/commonjs`.

  - In our package.json, we have a `main` property leading to the
    commonjs build, a `module` property leading to the es2017 one and
    an `exports` property listing all possible import paths, leading to
    one or the other, depending on properties.

I sadly had to change a little the way the RxPlayer tools are declared,
now always through a directory and inner `index.js` as the `exports`
property syntax does not seem to allow for ambiguity on whether a
path import `path.js` or `path/index.js`.

I also profited from this commit to only build the demo through
esbuild, not webpack anymore, as we didn't really rely on the
latter anymore.

Author: peaBerberian

.eslintrc.js

@@ -10,7 +10,7 @@ module.exports = {
   ],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
-    "project": "tsconfig.json",
+    "project": "tsconfig.eslint.json",
     "sourceType": "module"
   },
   "plugins": [

FILES.md

@@ -22,8 +22,7 @@ At the time of writing, there are two distinct demos:
 
 The `dist/` directory stores the player builds of the last version released.
 
-Two directories, namely ``_esm5.raw`` and ``_esm5.processed`` can also be
-generated in here if the right scripts are called.
+Directories can also be generated in here if the right scripts are called.
 These allow to publish more modular codebases to npm.
 
 

jest.config.js

@@ -6,7 +6,7 @@ module.exports = {
   roots: ["<rootDir>/src"],
   preset: "ts-jest",
   testEnvironment: "jsdom",
-  testMatch: ["**/?(*.)+(spec|test).[jt]s?(x)"],
+  testMatch: ["**/?(*.)+(test).[jt]s"],
   collectCoverageFrom: [
     "src/**/*.ts",
     "!src/**/index.ts",
@@ -16,26 +16,7 @@ module.exports = {
     "^.+\\.tsx?$": [
       "ts-jest",
       {
-        tsconfig: {
-          target: "es2017",
-          lib: ["es2017", "dom"],
-          forceConsistentCasingInFileNames: true,
-          skipLibCheck: false,
-          noImplicitAny: true,
-          strict: true,
-          strictNullChecks: true,
-          strictPropertyInitialization: true,
-          noUnusedParameters: true,
-          noUnusedLocals: true,
-          types: ["jest"],
-          module: "es2015",
-          moduleResolution: "node",
-          esModuleInterop: true,
-          typeRoots: [
-            "./src/typings",
-            "./node_modules/@types",
-          ],
-        },
+        tsconfig: "tsconfig.jest.json",
       },
     ],
   },

package.json

@@ -3,7 +3,103 @@
   "author": "Canal+",
   "version": "4.0.0-beta.3",
   "description": "Canal+ HTML5 Video Player",
-  "main": "./dist/_esm5.processed/index.js",
+  "main": "./dist/commonjs/index.js",
+  "module": "./dist/es2017/index.js",
+  "browser": "./dist/es2017/index.js",
+  "exports": {
+    ".": {
+      "node": "./dist/commonjs/index.js",
+      "es2015": "./dist/es2017/index.js",
+      "require": "./dist/commonjs/index.js",
+      "import": "./dist/es2017/index.js",
+      "default": "./dist/es2017/index.js"
+    },
+    "./experimental": {
+      "node": "./dist/commonjs/experimental/index.js",
+      "es2015": "./dist/es2017/experimental/index.js",
+      "require": "./dist/commonjs/experimental/index.js",
+      "import": "./dist/es2017/experimental/index.js",
+      "default": "./dist/es2017/experimental/index.js"
+    },
+    "./experimental/features": {
+      "node": "./dist/commonjs/experimental/features/index.js",
+      "es2015": "./dist/es2017/experimental/features/index.js",
+      "require": "./dist/commonjs/experimental/features/index.js",
+      "import": "./dist/es2017/experimental/features/index.js",
+      "default": "./dist/es2017/experimental/features/index.js"
+    },
+    "./experimental/features/*": {
+      "node": "./dist/commonjs/experimental/features/*.js",
+      "es2015": "./dist/es2017/experimental/features/*.js",
+      "require": "./dist/commonjs/experimental/features/*.js",
+      "import": "./dist/es2017/experimental/features/*.js",
+      "default": "./dist/es2017/experimental/features/*.js"
+    },
+    "./experimental/tools": {
+      "node": "./dist/commonjs/experimental/tools/index.js",
+      "es2015": "./dist/es2017/experimental/tools/index.js",
+      "require": "./dist/commonjs/experimental/tools/index.js",
+      "import": "./dist/es2017/experimental/tools/index.js",
+      "default": "./dist/es2017/experimental/tools/index.js"
+    },
+    "./experimental/tools/*": {
+      "node": "./dist/commonjs/experimental/tools/*/index.js",
+      "es2015": "./dist/es2017/experimental/tools/*/index.js",
+      "require": "./dist/commonjs/experimental/tools/*/index.js",
+      "import": "./dist/es2017/experimental/tools/*/index.js",
+      "default": "./dist/es2017/experimental/tools/*/index.js"
+    },
+    "./features": {
+      "node": "./dist/commonjs/features/list/index.js",
+      "es2015": "./dist/es2017/features/list/index.js",
+      "require": "./dist/commonjs/features/list/index.js",
+      "import": "./dist/es2017/features/list/index.js",
+      "default": "./dist/es2017/features/list/index.js"
+    },
+    "./features/*": {
+      "node": "./dist/commonjs/features/list/*.js",
+      "es2015": "./dist/es2017/features/list/*.js",
+      "require": "./dist/commonjs/features/list/*.js",
+      "import": "./dist/es2017/features/list/*.js",
+      "default": "./dist/es2017/features/list/*.js"
+    },
+    "./logger": {
+      "node": "./dist/commonjs/log.js",
+      "es2015": "./dist/es2017/log.js",
+      "require": "./dist/commonjs/log.js",
+      "import": "./dist/es2017/log.js",
+      "default": "./dist/es2017/log.js"
+    },
+    "./minimal": {
+      "node": "./dist/commonjs/minimal.js",
+      "es2015": "./dist/es2017/minimal.js",
+      "require": "./dist/commonjs/minimal.js",
+      "import": "./dist/es2017/minimal.js",
+      "default": "./dist/es2017/minimal.js"
+    },
+    "./tools": {
+      "node": "./dist/commonjs/tools/index.js",
+      "es2015": "./dist/es2017/tools/index.js",
+      "require": "./dist/commonjs/tools/index.js",
+      "import": "./dist/es2017/tools/index.js",
+      "default": "./dist/es2017/tools/index.js"
+    },
+    "./tools/*": {
+      "node": "./dist/commonjs/tools/*/index.js",
+      "es2015": "./dist/es2017/tools/*/index.js",
+      "require": "./dist/commonjs/tools/*/index.js",
+      "import": "./dist/es2017/tools/*/index.js",
+      "default": "./dist/es2017/tools/*/index.js"
+    },
+    "./types": {
+      "node": "./dist/commonjs/types/index.js",
+      "es2015": "./dist/es2017/types/index.js",
+      "require": "./dist/commonjs/types/index.js",
+      "import": "./dist/es2017/types/index.js",
+      "default": "./dist/es2017/types/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "keywords": [
     "dash",
     "eme",
@@ -17,7 +113,6 @@
     "typescript",
     "video"
   ],
-  "browser": "./dist/_esm5.processed/index.js",
   "homepage": "https://github.com/canalplus/rx-player",
   "bugs": "https://github.com/canalplus/rx-player/issues",
   "license": "Apache-2.0",
@@ -42,9 +137,9 @@
     "check:types:watch": "tsc --noEmit --watch --project .",
     "check:demo": "npm run check:demo:types && npm run lint:demo",
     "check:demo:types": "tsc --noEmit --project demo/full",
-    "demo": "node ./scripts/generate_full_demo.js --production-mode",
-    "demo:min": "node ./scripts/generate_full_demo.js --production-mode --minify",
-    "demo:watch": "node ./scripts/generate_full_demo.js --watch --production-mode",
+    "demo": "node ./scripts/build_demo.mjs --production-mode",
+    "demo:min": "node ./scripts/build_demo.mjs --production-mode --minify",
+    "demo:watch": "node ./scripts/build_demo.mjs --watch --production-mode",
     "doc": "readme.doc doc/ doc/generated \"$(cat VERSION)\"",
     "lint": "eslint src -c .eslintrc.js",
     "lint:demo": "eslint -c demo/full/.eslintrc.js demo/full/scripts",
@@ -53,10 +148,8 @@
     "prepublishOnly": "npm run build:all",
     "releases:dev": "./scripts/make-dev-releases",
     "standalone": "node ./scripts/run_standalone_demo.js",
-    "start": "node ./scripts/start_demo_web_server.js",
-    "start:wasm": "node ./scripts/start_demo_web_server.js --include-wasm",
-    "s": "node ./scripts/start_demo_web_server.js --fast",
-    "s:wasm": "node ./scripts/start_demo_web_server.js --fast --include-wasm",
+    "start": "node ./scripts/start_demo_web_server.mjs",
+    "sart:wasm": "node ./scripts/start_demo_web_server.mjs --include-wasm",
     "wasm-strip": "node scripts/wasm-strip.js dist/mpd-parser.wasm",
     "test:appveyor": "npm run test:unit && npm run test:memory",
     "test:integration": "node tests/integration/run.js --bchromehl --bfirefoxhl",
@@ -137,8 +230,6 @@
     "Build a demo page (e.g. to test a code change)": {
       "start": "Build the \"full\" demo (with a UI) with the non-minified RxPlayer and serve it on a local server. Re-build on file updates.",
       "start:wasm": "Build the \"full\" demo (with a UI) with the non-minified RxPlayer including the DASH WebAssembly MPD parser and serve it on a local server. Re-build on file updates.",
-      "s": "Very fast version of `start` which does not perform type-checking. This script can be useful for quick testing",
-      "s:wasm": "Very fast version of `start:wasm` which does not perform type-checking. This script can be useful for quick testing",
       "demo": "Build the demo in demo/bundle.js",
       "demo:min": "Build the demo and minify it in demo/bundle.js",
       "demo:watch": "Build the demo in demo/bundle.js each times the files update.",

scripts/build/generate_build.js

@@ -24,15 +24,13 @@ const os = require("os");
 const path = require("path");
 const { rimraf } = require("rimraf");
 
-const BUILD_DIR_FROM_ROOT = "dist/_esm5.processed";
+const BUILD_DIR_FROM_ROOT_FOR_TEMPLATES = "dist/es2017";
 
 const ROOT_DIR = path.join(__dirname, "../../");
 const TEMPLATE_DIR = path.join(__dirname, "../../scripts/build/templates");
-const TMP_BUILD_DIR = path.join(ROOT_DIR, "dist/_esm5.raw");
-const BUILD_DIR = path.join(ROOT_DIR, BUILD_DIR_FROM_ROOT);
 const BUILD_ARTEFACTS_TO_REMOVE = [
-  "dist/_esm5.processed",
-  "dist/_esm5.raw",
+  "dist/commonjs",
+  "dist/es2017",
   "features",
   "minimal",
   "experimental",
@@ -54,9 +52,6 @@ async function generateBuild() {
     console.log(" ⚙️  Compiling project with TypeScript...");
     await compile();
 
-    console.log(" 🚚 Moving built code to its final directory...");
-    await fs.rename(TMP_BUILD_DIR, BUILD_DIR);
-
     console.log(" 📦 Generating imported files from templates...");
     await generateImportFilesFromTemplates();
   } catch (err) {
@@ -86,15 +81,22 @@ async function removePreviousBuildArtefacts() {
  * @returns {Promise}
  */
 async function compile() {
-    // Sadly TypeScript compiler API seems to be sub-par.
-    // I did not find for example how to exclude some files (our unit tests)
-    // easily by running typescript directly from NodeJS.
-    // So we just spawn a separate process running tsc:
-    await spawnProm(
+  // Sadly TypeScript compiler API seems to be sub-par.
+  // I did not find for example how to exclude some files (our unit tests)
+  // easily by running typescript directly from NodeJS.
+  // So we just spawn a separate process running tsc:
+  await Promise.all([
+    spawnProm(
       "npx tsc -p",
-      [path.join(ROOT_DIR, "tsconfig.modules.json")],
-      (code) => new Error(`Compilation process exited with code ${code}`),
-    );
+      [path.join(ROOT_DIR, "tsconfig.json")],
+      (code) => new Error(`CommonJS compilation process exited with code ${code}`),
+    ),
+    spawnProm(
+      "npx tsc -p",
+      [path.join(ROOT_DIR, "tsconfig.commonjs.json")],
+      (code) => new Error(`es2018 compilation process exited with code ${code}`),
+    )
+  ]);
 }
 
 /**
@@ -165,7 +167,7 @@ async function copyDir(src, dest) {
  * @returns {Promise}
  */
 async function replaceTokensInTemplates(fileDest) {
-  const sedDir = BUILD_DIR_FROM_ROOT.replace(/\//g, "\\/");
+  const sedDir = BUILD_DIR_FROM_ROOT_FOR_TEMPLATES.replace(/\//g, "\\/");
   switch (os.type()) {
     case "Darwin":
       await spawnProm(

scripts/build/templates/experimental/tools/VideoThumbnailLoader/index.d.ts renamed to scripts/build/templates/experimental/tools/VideoThumbnailLoader.d.ts

@@ -13,6 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import VideoThumbnailLoader from "../../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index";
-export * from "../../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index";
+import VideoThumbnailLoader from "../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index";
+export * from "../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index";
 export default VideoThumbnailLoader;

scripts/build/templates/experimental/tools/VideoThumbnailLoader/index.js renamed to scripts/build/templates/experimental/tools/VideoThumbnailLoader.js

@@ -13,6 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import VideoThumbnailLoader from "../../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index.js";
-export * from "../../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index.js";
+import VideoThumbnailLoader from "../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index.js";
+export * from "../../__BUILD_DIR__/experimental/tools/VideoThumbnailLoader/index.js";
 export default VideoThumbnailLoader;

scripts/build/constants.d.ts renamed to scripts/build/templates/experimental/tools/createMetaplaylist.d.ts

@@ -13,19 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
-/* eslint-disable @typescript-eslint/naming-convention */
-
-// Define build-time constants corresponding to the regular build.
-
-declare const enum __LOGGER_LEVEL__ {
-  CURRENT_LEVEL = "NONE",
-}
-
-declare const enum __ENVIRONMENT__ {
-  PRODUCTION = 0,
-  DEV = 1,
-  CURRENT_ENV = PRODUCTION,
-}
-
-declare const __RX_PLAYER_DEBUG_MODE__ : boolean | undefined;
+import createMetaplaylist from "../../__BUILD_DIR__/experimental/tools/createMetaplaylist/index";
+export * from "../../__BUILD_DIR__/experimental/tools/createMetaplaylist/index";
+export default createMetaplaylist;

scripts/build/templates/experimental/tools/createMetaplaylist.js

@@ -0,0 +1,18 @@
+/**
+ * Copyright 2015 CANAL+ Group
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import createMetaplaylist from "../../__BUILD_DIR__/experimental/tools/createMetaplaylist/index.js";
+export * from "../../__BUILD_DIR__/experimental/tools/createMetaplaylist/index.js";
+export default createMetaplaylist;

scripts/build/templates/experimental/tools/mediaCapabilitiesProber.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright 2015 CANAL+ Group
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import mediaCapabilitiesProber from "../../__BUILD_DIR__/experimental/tools/mediaCapabilitiesProber/index";
+export * from "../../__BUILD_DIR__/experimental/tools/mediaCapabilitiesProber/index";
+export default mediaCapabilitiesProber;

scripts/build/templates/experimental/tools/mediaCapabilitiesProber.js

@@ -0,0 +1,18 @@
+/**
+ * Copyright 2015 CANAL+ Group
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import mediaCapabilitiesProber from "../../__BUILD_DIR__/experimental/tools/mediaCapabilitiesProber/index.js";
+export * from "../../__BUILD_DIR__/experimental/tools/mediaCapabilitiesProber/index.js";
+export default mediaCapabilitiesProber;

scripts/build/templates/experimental/tools/parseBIFThumbnails.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright 2015 CANAL+ Group
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import parseBIFThumbnails from "../../__BUILD_DIR__/experimental/tools/parseBIFThumbnails/index";
+export * from "../../__BUILD_DIR__/experimental/tools/parseBIFThumbnails/index";
+export default parseBIFThumbnails;