update webpack flow

Gulpfile.js

@@ -1,151 +0,0 @@
-/* eslint-disable no-var, no-param-reassign */
-/* these eslint rules are disabled because gulp does not support babel yet */
-'use strict';
-const _ = require('lodash');
-const fs = require('fs');
-const path = require('path');
-const assert = require('assert');
-const gulp = require('gulp');
-const webpack = require('webpack');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
-
-const pkg = require('./package.json');
-
-const uglifyOptions = {
-  mangle: {
-    reserved: ['_', 'RippleError', 'RippledError', 'UnexpectedError',
-    'LedgerVersionError', 'ConnectionError', 'NotConnectedError',
-    'DisconnectedError', 'TimeoutError', 'ResponseFormatError',
-    'ValidationError', 'NotFoundError', 'MissingLedgerHistoryError',
-    'PendingLedgerVersionError'
-    ]
-  }
-};
-
-function getWebpackConfig(extension, overrides) {
-  overrides = overrides || {};
-  let defaults = {
-    cache: true,
-    externals: [{
-      'lodash': '_'
-    }],
-    entry: './src/index.ts',
-    output: {
-      library: 'ripple',
-      path: path.join(__dirname, 'build/'),
-      filename: `ripple-${pkg.version}${extension}`
-    },
-    plugins: [
-      new webpack.NormalModuleReplacementPlugin(/^ws$/, './wswrapper'),
-      new webpack.NormalModuleReplacementPlugin(/^\.\/wallet$/, './wallet-web'),
-      new webpack.NormalModuleReplacementPlugin(/^.*setup-api$/,
-        './setup-api-web')
-    ],
-    module: {
-      rules: [{
-        test: /jayson/,
-        use: 'null',
-      }, {
-        test: /\.ts$/,
-        use: [{
-          loader: 'ts-loader',
-          options: {
-            compilerOptions: {
-              composite: false,
-              declaration: false,
-              declarationMap: false
-            }
-          },
-        }],
-      }]
-    },
-    resolve: {
-      extensions: [ '.ts', '.js' ]
-    },
-  };
-  return _.assign({}, defaults, overrides);
-}
-
-function webpackConfigForWebTest(testFileName) {
-  var match = testFileName.match(/\/?([^\/]*)-test.js$/);
-  if (!match) {
-    assert(false, 'wrong filename:' + testFileName);
-  }
-  var configOverrides = {
-    externals: [{
-      'lodash': '_',
-      'ripple-api': 'ripple',
-      'net': 'null'
-    }],
-    entry: testFileName,
-    output: {
-      library: match[1].replace(/-/g, '_'),
-      path: path.join(__dirname, 'test-compiled-for-web/'),
-      filename: match[1] + '-test.js'
-    }
-  };
-  return getWebpackConfig('.js', configOverrides);
-}
-
-function createLink(from, to) {
-  if (fs.existsSync(to)) {
-    fs.unlinkSync(to);
-  }
-  fs.linkSync(from, to);
-}
-
-function createBuildLink(callback) {
-  return function(err, res) {
-    createLink('./build/ripple-' + pkg.version + '.js',
-      './build/ripple-latest.js');
-    callback(err, res);
-  };
-}
-
-function watch(callback) {
-  gulp.watch('src/*', gulp.series(buildDebug));
-  callback();
-}
-
-function build(callback) {
-  webpack(getWebpackConfig('.js'), createBuildLink(callback));
-}
-
-function buildDebug(callback) {
-  const webpackConfig = getWebpackConfig('-debug.js', {devtool: 'eval'});
-  webpackConfig.plugins.unshift(new webpack.LoaderOptionsPlugin({debug: true}));
-  webpack(webpackConfig, callback);
-}
-
-function buildMin(callback) {
-  const webpackConfig = getWebpackConfig('-min.js');
-  webpackConfig.plugins.push(new UglifyJsPlugin({uglifyOptions}));
-  webpack(webpackConfig, function() {
-    createLink('./build/ripple-' + pkg.version + '-min.js',
-      './build/ripple-latest-min.js');
-    callback();
-  });
-}
-
-function buildTests(callback) {
-  var times = 0;
-  function done() {
-    if (++times >= 5) {
-      callback();
-    }
-  }
-  webpack(webpackConfigForWebTest('./test/rangeset-test.js'), done);
-  webpack(webpackConfigForWebTest('./test/connection-test.js'), done);
-  webpack(webpackConfigForWebTest('./test/api-test.js'), done);
-  webpack(webpackConfigForWebTest('./test/broadcast-api-test.js'), done);
-  webpack(webpackConfigForWebTest('./test/integration/integration-test.js',
-    'integration/'), done);
-}
-
-exports.watch = watch;
-exports.build = build;
-exports.buildDebug = buildDebug;
-exports.buildMin = buildMin;
-exports.buildTests = buildTests;
-
-exports.default = gulp.parallel(build, buildDebug, buildMin);

package.json

@@ -40,29 +40,29 @@
     "ejs": "^2.3.4",
     "eslint": "^6.5.1",
     "eventemitter2": "^5.0.1",
-    "gulp": "^4.0.2",
-    "json-loader": "^0.5.2",
     "json-schema-to-markdown-table": "^0.4.0",
     "mocha": "6.2.0",
     "mocha-junit-reporter": "^1.9.1",
-    "null-loader": "^0.1.1",
     "nyc": "^14.1.1",
     "source-map-support": "0.5.12",
-    "ts-loader": "^3.2.0",
-    "ts-node": "8.0.3",
+    "ts-node": "^8.4.1",
     "typescript": "^3.6.4",
-    "uglifyjs-webpack-plugin": "^1.1.4",
-    "webpack": "3.12.0"
+    "webpack": "^4.30.0",
+    "webpack-bundle-analyzer": "^3.6.0",
+    "webpack-cli": "^3.3.9"
   },
   "scripts": {
-    "build": "gulp",
+    "build:schemas": "mkdir -p dist/npm/common && cp -r src/common/schemas dist/npm/common/",
+    "build:lib": "tsc --build",
+    "build:web": "webpack",
+    "build": "yarn build:schemas && yarn build:lib && yarn build:web",
+    "analyze": "yarn build:web --analyze",
+    "watch": "yarn build:lib --watch",
+    "clean": "rm -rf dist/npm",
     "doctoc": "doctoc docs/index.md --title '# RippleAPI Reference' --github --maxlevel 2",
     "docgen": "node --harmony scripts/build_docs.js",
-    "clean": "rm -rf dist/npm",
-    "compile": "mkdir -p dist/npm/common && cp -r src/common/schemas dist/npm/common/ && tsc --build",
-    "watch": "tsc -w",
-    "prepublish": "npm run clean && npm run compile && npm run build",
-    "test": "TS_NODE_PROJECT=test/tsconfig.json nyc mocha --exit",
+    "prepublish": "yarn clean && yarn build",
+    "test": "TS_NODE_PROJECT=src/tsconfig.json nyc mocha --exit",
     "lint": "eslint src/**/*.ts 'test/*-test.{ts,js}'",
     "perf": "./scripts/perf_test.sh",
     "start": "node scripts/http.js"

webpack.config.js

@@ -0,0 +1,50 @@
+'use strict';
+const path = require('path');
+const webpack = require('webpack');
+const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer');
+
+function getDefaultConfiguration() {
+  return {
+  cache: true,
+  performance: { hints: false },
+  stats: 'errors-only',
+  externals: [{
+    'lodash': '_'
+  }],
+  entry: './dist/npm/index.js',
+  output: {
+    library: 'ripple',
+    path: path.join(__dirname, 'build/'),
+    filename: `ripple-lib.default.js`,
+  },
+  plugins: [
+    new webpack.NormalModuleReplacementPlugin(/^ws$/, './wswrapper'),
+    new webpack.NormalModuleReplacementPlugin(/^\.\/wallet$/, './wallet-web'),
+    new webpack.NormalModuleReplacementPlugin(/^.*setup-api$/, './setup-api-web'),
+  ],
+  module: {
+    rules: []
+  },
+  resolve: {
+    extensions: ['.js', '.json']
+  },
+};
+}
+
+module.exports = [
+  function(env, argv) {
+    const config = getDefaultConfiguration();
+    config.mode = 'development';
+    config.output.filename = `ripple-lib.development.js`;
+    return config;
+  },
+  function(env, argv) {
+    const config = getDefaultConfiguration();
+    config.mode = 'production';
+    config.output.filename = `ripple-lib.production.min.js`;
+    if (process.argv.includes('--analyze')) {
+      config.plugins.push(new BundleAnalyzerPlugin());
+    }
+    return config;
+  },
+];