From 2b21f27ac2d3b3124dfeaecefbb2962982c75ef5 Mon Sep 17 00:00:00 2001
From: Daniel Imms <2193314+Tyriar@users.noreply.github.com>
Date: Sun, 27 Aug 2023 09:00:48 -0700
Subject: [PATCH] Fix demo build script

---
 demo/start.js                        | 59 +---------------------------
 demo/{build.js => webpack.config.js} | 31 ++++-----------
 package.json                         |  2 +-
 3 files changed, 10 insertions(+), 82 deletions(-)
 rename demo/{build.js => webpack.config.js} (54%)

diff --git a/demo/start.js b/demo/start.js
index 7349f36d..c0037545 100644
--- a/demo/start.js
+++ b/demo/start.js
@@ -5,69 +5,12 @@
 
 // @ts-check
 
-const path = require('path');
+const clientConfig = require('./webpack.config');
 const webpack = require('webpack');
 const startServer = require('./server.js');
 
 startServer();
 
-/**
- * This webpack config builds and watches the demo project. It works by taking the output from tsc
- * (via `yarn watch`) which is put into `out/` and then webpacks it into `demo/dist/`. The aliases
- * are used fix up the absolute paths output by tsc (because of `baseUrl` and `paths` in
- * `tsconfig.json`.
- *
- * For production builds see `webpack.config.js` in the root directory. If that is built the demo
- * can use that by switching out which `Terminal` is imported in `client.ts`, this is useful for
- * validating that the packaged version works correctly.
- *
- * @type {import('webpack').Configuration}
- */
-const clientConfig = {
-  entry: path.resolve(__dirname, 'client.ts'),
-  devtool: 'inline-source-map',
-  module: {
-    rules: [
-      {
-        test: /\.tsx?$/,
-        use: 'ts-loader',
-        exclude: /node_modules/
-      },
-      {
-        test: /\.js$/,
-        use: ["source-map-loader"],
-        enforce: "pre",
-        exclude: /node_modules/
-      }
-    ]
-  },
-  resolve: {
-    modules: [
-      'node_modules',
-      path.resolve(__dirname, '..'),
-      path.resolve(__dirname, '../addons')
-    ],
-    extensions: [ '.tsx', '.ts', '.js' ],
-    alias: {
-      common: path.resolve('./out/common'),
-      browser: path.resolve('./out/browser')
-    },
-    fallback: {
-      // The ligature modules contains fallbacks for node environments, we never want to browserify them
-      stream: false,
-      util: false,
-      os: false,
-      path: false,
-      fs: false
-    }
-  },
-  output: {
-    filename: 'client-bundle.js',
-    path: path.resolve(__dirname, 'dist')
-  },
-  mode: 'development',
-  watch: true
-};
 const compiler = webpack(clientConfig);
 
 compiler.watch({
diff --git a/demo/build.js b/demo/webpack.config.js
similarity index 54%
rename from demo/build.js
rename to demo/webpack.config.js
index 6685ba17..46a85394 100644
--- a/demo/build.js
+++ b/demo/webpack.config.js
@@ -1,26 +1,21 @@
 /**
- * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
  * @license MIT
  */
 
 // @ts-check
 
 const path = require('path');
-const webpack = require('webpack');
 
 /**
- * This webpack config builds and watches the demo project. It works by taking the output from tsc
- * (via `yarn watch`) which is put into `out/` and then webpacks it into `demo/dist/`. The aliases
- * are used fix up the absolute paths output by tsc (because of `baseUrl` and `paths` in
- * `tsconfig.json`.
- *
- * For production builds see `webpack.config.js` in the root directory. If that is built the demo
- * can use that by switching out which `Terminal` is imported in `client.ts`, this is useful for
- * validating that the packaged version works correctly.
+ * This webpack config does a production build for xterm.js. It works by taking the output from tsc
+ * (via `yarn watch` or `yarn prebuild`) which are put into `out/` and webpacks them into a
+ * production mode umd library module in `lib/`. The aliases are used fix up the absolute paths
+ * output by tsc (because of `baseUrl` and `paths` in `tsconfig.json`.
  *
  * @type {import('webpack').Configuration}
  */
-const clientConfig = {
+const config = {
   entry: path.resolve(__dirname, 'client.ts'),
   devtool: 'inline-source-map',
   module: {
@@ -62,16 +57,6 @@ const clientConfig = {
     filename: 'client-bundle.js',
     path: path.resolve(__dirname, 'dist')
   },
-  mode: 'development',
-  watch: true
+  mode: 'development'
 };
-const compiler = webpack(clientConfig);
-
-compiler.compile(() => (err, stats) => {
-  if (err) {
-    console.error(err);
-  }
-  console.log(stats?.toString({
-    colors: true
-  }));
-});
+module.exports = config;
diff --git a/package.json b/package.json
index 59cdf9e3..853ba45a 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
     "package-headless": "webpack --config ./webpack.config.headless.js",
     "postpackage-headless": "node ./bin/package_headless.js",
     "start": "node demo/start",
-    "build-demo": "node demo/build",
+    "build-demo": "webpack --config ./demo/webpack.config.js",
     "start-debug": "node --inspect-brk demo/start",
     "lint": "eslint -c .eslintrc.json --max-warnings 0 --ext .ts src/ addons/",
     "lint-api": "eslint --no-eslintrc -c .eslintrc.json.typings --max-warnings 0 --no-ignore --ext .d.ts typings/",