Convert build packager to rollup

Add an es module target (#2910)
UMD build worker injection (#5107)
Add ES5 syntax check for UMD builds (#5301, #5288)

.escheckrc

@@ -0,0 +1,7 @@
+{
+  "ecmaVersion": "es5",
+  "modules": "false",
+  "files": [
+    "./dist/**/*.js"
+  ]
+}

.eslintrc.js

@@ -16,11 +16,11 @@ module.exports = {
     __USE_CMCD__: true,
     __USE_CONTENT_STEERING__: true,
     __USE_VARIABLE_SUBSTITUTION__: true,
+    __HLS_UMD_WORKER__: true,
   },
   // see https://github.com/standard/eslint-config-standard
   // 'prettier' (https://github.com/prettier/eslint-config-prettier) must be last
   extends: ['eslint:recommended', 'prettier'],
-  ignorePatterns: ['/src/demux/webworkify-webpack.js'],
   parser: '@typescript-eslint/parser',
   parserOptions: {
     sourceType: 'module',

.prettierignore

@@ -5,5 +5,4 @@
 /demo/libs
 /dist
 /lib
-/src/demux/webworkify-webpack.js
 package-lock.json

README.md

@@ -19,7 +19,7 @@ HLS.js works directly on top of a standard HTML`<video>` element.
 
 HLS.js is written in [ECMAScript6] (`*.js`) and [TypeScript] (`*.ts`) (strongly typed superset of ES6), and transpiled in ECMAScript5 using [Babel](https://babeljs.io/) and the [TypeScript compiler].
 
-[Webpack] is used to build the distro bundle and serve the local development environment.
+[Rollup] is used to build the distro bundle and serve the local development environment.
 
 [html5 video]: https://www.html5rocks.com/en/tutorials/video/basics/
 [mediasource extensions]: https://w3c.github.io/media-source/
@@ -28,7 +28,7 @@ HLS.js is written in [ECMAScript6] (`*.js`) and [TypeScript] (`*.ts`) (strongly
 [ecmascript6]: https://github.com/ericdouglas/ES6-Learning#articles--tutorials
 [typescript]: https://www.typescriptlang.org/
 [typescript compiler]: https://www.typescriptlang.org/docs/handbook/compiler-options.html
-[webpack]: https://webpack.js.org/
+[rollup]: https://rollupjs.org/
 
 ## Features
 
@@ -177,7 +177,7 @@ Only debug-mode artifacts:
 npm run build:debug
 ```
 
-Build and watch (customized dev setups where you'll want to host through another server than webpacks' - for example in a sub-module/project)
+Build and watch (customized dev setups where you'll want to host through another server - for example in a sub-module/project)
 
 ```
 npm run build:watch

docs/design.md

@@ -17,7 +17,7 @@ design idea is pretty simple :
 - all subsystems are instantiated by the Hls instance.
 - each subsystem heavily relies on events for internal/external communications.
 - Events are handled using [EventEmitter3](https://github.com/primus/eventemitter3)
-- bundled for the browser by [webpack](https://webpack.js.org/)
+- bundled for the browser by [rollup](https://rollupjs.org/)
 
 ## Code structure
 

karma.conf.js

@@ -1,40 +1,90 @@
-const { merge } = require('webpack-merge');
-const webpack = require('webpack');
-const webpackConfig = require('./webpack.config')({ debug: true })[0];
-delete webpackConfig.entry;
-delete webpackConfig.output;
-const karmaWebpack = {
-  devtool: 'inline-source-map',
-  module: {
-    rules: [
-      {
-        test: /\.(ts|js)$/,
-        exclude: /(node_modules|tests)/,
-        enforce: 'post',
-        use: [
+/* global process:false */
+const { nodeResolve } = require('@rollup/plugin-node-resolve');
+const commonjs = require('@rollup/plugin-commonjs');
+const babel = require('@rollup/plugin-babel').babel;
+const replace = require('@rollup/plugin-replace');
+
+const extensions = ['.ts', '.js'];
+
+const rollupPreprocessor = {
+  output: {
+    format: 'umd',
+    banner: '(function __HLS_UMD_BUNDLE__(__IN_WORKER__){',
+    footer: '})(false);',
+    name: 'hlsjsunittests',
+    dir: 'temp',
+    sourcemap: 'inline',
+  },
+  plugins: [
+    nodeResolve({
+      extensions,
+    }),
+    commonjs({
+      transformMixedEsModules: true,
+    }),
+    replace({
+      preventAssignment: true,
+      values: {
+        __VERSION__: JSON.stringify(''),
+        __USE_SUBTITLES__: JSON.stringify(true),
+        __USE_ALT_AUDIO__: JSON.stringify(true),
+        __USE_EME_DRM__: JSON.stringify(true),
+        __USE_CMCD__: JSON.stringify(true),
+        __USE_CONTENT_STEERING__: JSON.stringify(true),
+        __USE_VARIABLE_SUBSTITUTION__: JSON.stringify(true),
+        __HLS_UMD_WORKER__: JSON.stringify(true),
+      },
+    }),
+    babel({
+      extensions,
+      babelHelpers: 'bundled',
+      presets: [
+        [
+          '@babel/preset-typescript',
           {
-            loader: 'coverage-istanbul-loader',
-            options: {
-              esModules: true,
+            optimizeConstEnums: true,
+          },
+        ],
+        [
+          '@babel/preset-env',
+          {
+            loose: true,
+            modules: false,
+            targets: {
+              browsers: [
+                'chrome >= 47',
+                'firefox >= 51',
+                'safari >= 8',
+                'ios >= 8',
+                'android >= 4',
+              ],
             },
           },
         ],
-      },
-    ],
-  },
-  resolve: {
-    fallback: {
-      util: false,
-    },
-  },
+      ],
+      plugins: [
+        [
+          '@babel/plugin-proposal-class-properties',
+          {
+            loose: true,
+          },
+        ],
+        '@babel/plugin-proposal-object-rest-spread',
+        '@babel/plugin-transform-object-assign',
+        '@babel/plugin-proposal-optional-chaining',
+      ],
+    }),
+  ],
 };
 
-// Remove coverage post-processor for JavaScript debugging when running `test:unit:debug`
-if (process.env.DEBUG_UNIT_TESTS) {
-  karmaWebpack.module.rules = [];
-}
+// Do not add coverage for JavaScript debugging when running `test:unit:debug`
+const preprocessors = {
+  './tests/index.js': ['rollup'],
+};
 
-const mergeConfig = merge(webpackConfig, karmaWebpack);
+if (!process.env.DEBUG_UNIT_TESTS) {
+  preprocessors['./src/**/*.ts'] = ['coverage'];
+}
 
 module.exports = function (config) {
   config.set({
@@ -43,7 +93,6 @@ module.exports = function (config) {
     frameworks: ['mocha', 'sinon-chai'],
 
     // list of files / patterns to load in the browser
-    // https://github.com/webpack-contrib/karma-webpack#alternative-usage
     files: [
       {
         pattern: 'tests/index.js',
@@ -56,22 +105,21 @@ module.exports = function (config) {
 
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    // node_modules must not be webpacked or else Karma will fail to load frameworks
-    preprocessors: {
-      'tests/index.js': ['webpack', 'sourcemap'],
-    },
+    preprocessors,
 
     // test results reporter to use
     // possible values: 'dots', 'progress'
     // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha', 'coverage-istanbul'],
+    reporters: ['mocha', 'coverage'],
 
-    coverageIstanbulReporter: {
-      reports: ['lcov', 'text-summary'],
-      fixWebpackSourcePaths: true,
+    coverageReporter: {
+      reporters: [
+        { type: 'lcov', subdir: '.' },
+        { type: 'text', subdir: '.' },
+      ],
     },
 
-    webpack: mergeConfig,
+    rollupPreprocessor,
 
     // web server port
     port: 9876,