Update rollup and webpack

build/build.ts

@@ -21,9 +21,11 @@ import * as path from "path";
 import * as fs from "fs";
 import { promisify } from "util";
 import { rollup, WarningHandler } from "rollup";
-import rollupJson from "rollup-plugin-json";
+import rollupJson from "@rollup/plugin-json";
-import typescript from "rollup-plugin-typescript";
+import typescript from "@rollup/plugin-typescript";
 import { terser } from "rollup-plugin-terser";
+import nodeResolve from "@rollup/plugin-node-resolve";
+import commonjs from "@rollup/plugin-commonjs";
 import webpack from "webpack";
 import postcss from "postcss";
 import postcssImport from "postcss-import";
@@ -251,11 +253,12 @@ async function generateBackendJs(): Promise<void> {
       },
       treeshake: {
         propertyReadSideEffects: false,
-        pureExternalModules: true,
+        moduleSideEffects: false,
       },
       plugins: [
         rollupJson({ preferConst: true }),
         {
+          name: "",
           resolveId: (importee, importer) => {
             if (importee.endsWith("/package.json")) {
               const p = path.resolve(path.dirname(importer), importee);
@@ -292,17 +295,20 @@ async function generateFrontendJs(): Promise<void> {
   const inputFile = path.resolve(INPUT_DIR, "ui/app.ts");
   const outputFile = path.resolve(OUTPUT_DIR, "public/app.js");
 
+  const inlineDeps = ["mithril", "parsimmon"];
   const bundle = await rollup({
     input: inputFile,
-    external: externals,
+    external: externals.filter((e) => !inlineDeps.includes(e)),
     plugins: [
       rollupJson({ preferConst: true }),
       typescript({ tsconfig: "./tsconfig.json" }),
+      nodeResolve(),
+      commonjs(),
     ],
     inlineDynamicImports: true,
     treeshake: {
       propertyReadSideEffects: false,
-      pureExternalModules: true,
+      moduleSideEffects: false,
     },
     onwarn: ((warning, warn) => {
       // Ignore circular dependency warnings
@@ -312,7 +318,7 @@ async function generateFrontendJs(): Promise<void> {
 
   await bundle.write({
     preferConst: true,
-    format: "esm",
+    format: "es",
     sourcemap: "inline",
     sourcemapExcludeSources: true,
     file: outputFile,

package.json

@@ -36,6 +36,10 @@
     "yaml": "^1.6.0"
   },
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^14.0.0",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^8.4.0",
+    "@rollup/plugin-typescript": "^5.0.2",
     "@types/jsonwebtoken": "^8.3.2",
     "@types/koa": "^2.0.49",
     "@types/koa-compress": "^2.0.9",
@@ -59,15 +63,13 @@
     "postcss-import": "^12.0.1",
     "postcss-preset-env": "^6.7.0",
     "prettier": "^2.0.5",
-    "rollup": "^1.17.0",
+    "rollup": "^2.23.0",
-    "rollup-plugin-json": "^4.0.0",
+    "rollup-plugin-terser": "^6.1.0",
-    "rollup-plugin-terser": "^5.1.1",
+    "source-map-loader": "^1.0.1",
-    "rollup-plugin-typescript": "^1.0.1",
-    "source-map-loader": "^0.2.4",
     "svgo": "^1.3.0",
     "ts-node": "^8.10.2",
     "typescript": "^3.9.7",
-    "webpack": "^4.38.0"
+    "webpack": "^4.44.0"
   },
   "engines": {
     "node": ">=8.14.0"