Migrate to ESM and ECMA2022 (second attempt)

.eslintrc.js → .eslintrc.cjs

@@ -7,7 +7,7 @@ module.exports = {
     'plugin:@typescript-eslint/recommended',
   ],
   parserOptions: {
-    ecmaVersion: 2018,
+    ecmaVersion: 2022,
     sourceType: 'module',
   },
   root: true,

build.mjs

@@ -6,7 +6,7 @@ const buildOptions = {
   entryPoints: ['src/ui.tsx'],
   bundle: true,
   platform: 'browser',
-  target: 'es2020',
+  target: 'es2022',
   minify: true,
   sourcemap: true,
   metafile: true,
@@ -27,7 +27,7 @@ const buildOptions = {
       }]
     })
   ],
-  resolveExtensions: ['.js', '.ts', '.tsx', '.svg', '.worker.js'],
+  resolveExtensions: ['.mjs', '.js', '.ts', '.tsx', '.svg', '.worker.js'],
 };
 
 (async () => {

cli.mjs

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+import { cli } from './dist/server/cli.js';
+cli();

index.mjs

@@ -0,0 +1,2 @@
+import server from './dist/server/server.js';
+export { server };

jest.config.mjs

@@ -0,0 +1,14 @@
+export default {
+  preset: 'ts-jest',
+  moduleNameMapper: {
+    './ebb.js': './ebb.ts',
+    './massager.js': './massager.ts',
+    './paper-size.js': './paper-size.ts',
+    './planning.js': './planning.ts',
+    './regex-transform-stream.js': './regex-transform-stream.ts',
+    './serialport-serialport.js': './serialport-serialport.ts',
+    './server.js': './server.ts',
+    './util.js': './util.ts',
+    './vec.js': './vec.ts',
+  },
+};

package.json

@@ -14,9 +14,9 @@
     "hardware",
     "robot"
   ],
-  "main": "index.js",
+  "main": "index.mjs",
   "bin": {
-    "saxi": "cli.js"
+    "saxi": "cli.mjs"
   },
   "scripts": {
     "prebuild": "npm run lint",
@@ -25,7 +25,7 @@
     "build:server": "tsc",
     "build:ui": "node --experimental-modules build.mjs",
     "prepare": "rimraf dist && npm run build",
-    "start": "npm run build && node cli.js",
+    "start": "npm run build && node cli.mjs",
     "dev": "BUILD_MODE=development npm start",
     "deploy": "rimraf dist/ui && IS_WEB=1 npm run build:ui && gh-pages --dist dist/ui",
     "test": "jest"
@@ -79,12 +79,10 @@
   "engines": {
     "node": ">=18.0.0"
   },
-  "jest": {
-    "preset": "ts-jest"
-  },
+  "type": "module",
   "files": [
     "/dist",
-    "cli.js"
+    "cli.mjs"
   ],
   "optionalDependencies": {
     "@esbuild/linux-arm": "^0.25.0",

src/cli.ts

@@ -1,15 +1,15 @@
 import yargs from "yargs";
 import { hideBin } from 'yargs/helpers';
-import { connectEBB, startServer } from "./server";
-import { replan } from "./massager";
+import { connectEBB, startServer } from "./server.js";
+import { replan } from "./massager.js";
 import { Window } from "svgdom";
 import { readFileSync } from "node:fs";
 import { flattenSVG, type Line } from "flatten-svg";
-import type { Vec2 } from "./vec";
-import { formatDuration } from "./util";
-import { Device, type PlanOptions, defaultPlanOptions } from "./planning";
-import { PaperSize } from "./paper-size";
-import type { Hardware } from "./ebb";
+import type { Vec2 } from "./vec.js";
+import { formatDuration } from "./util.js";
+import { Device, type PlanOptions, defaultPlanOptions } from "./planning.js";
+import { PaperSize } from "./paper-size.js";
+import type { Hardware } from "./ebb.js";
 
 function parseSvg(svg: string) {
   const window = new Window;

src/ebb.ts

@@ -1,6 +1,6 @@
-import { type Block, type Motion, PenMotion, type Plan, XYMotion } from "./planning";
-import { RegexParser } from "./regex-transform-stream";
-import { type Vec2, vsub } from "./vec";
+import { type Block, type Motion, PenMotion, type Plan, XYMotion } from "./planning.js";
+import { RegexParser } from "./regex-transform-stream.js";
+import { type Vec2, vsub } from "./vec.js";
 
 /** Split d into its fractional and integral parts */
 function modf(d: number): [number, number] {

src/massager.ts

@@ -1,7 +1,7 @@
 import { reorder as sortPaths, elideShorterThan, merge as joinNearbyPaths } from "optimize-paths";
-import { Device, type Plan, type PlanOptions, plan } from "./planning";
-import { dedupPoints, scaleToPaper, cropToMargins } from "./util";
-import { type Vec2, vmul, vrot } from "./vec";
+import { Device, type Plan, type PlanOptions, plan } from "./planning.js";
+import { dedupPoints, scaleToPaper, cropToMargins } from "./util.js";
+import { type Vec2, vmul, vrot } from "./vec.js";
 
 // CSS, and thus SVG, defines 1px = 1/96th of 1in
 // https://www.w3.org/TR/css-values-4/#absolute-lengths

src/paper-size.ts

@@ -1,4 +1,4 @@
-import { type Vec2, vmul } from "./vec";
+import { type Vec2, vmul } from "./vec.js";
 
 function vround(v: Vec2, digits = 2): Vec2 {
   return { x: Number(v.x.toFixed(digits)), y: Number(v.y.toFixed(digits)) };

src/planning.ts

@@ -1,7 +1,7 @@
 // Cribbed from https://github.com/fogleman/axi/blob/master/axi/planner.py
-import type { Hardware } from './ebb';
-import { PaperSize } from './paper-size';
-import { vadd, vdot, type Vec2, vlen, vmul, vnorm, vsub } from './vec';
+import type { Hardware } from './ebb.js';
+import { PaperSize } from './paper-size.js';
+import { vadd, vdot, type Vec2, vlen, vmul, vnorm, vsub } from './vec.js';
 const epsilon = 1e-9;
 
 export interface PlanOptions {

src/server.ts

@@ -9,13 +9,12 @@ import type { PortInfo } from "@serialport/bindings-interface";
 import { WakeLock } from "wake-lock";
 import type WebSocket from 'ws';
 import { WebSocketServer } from 'ws';
-import { SerialPortSerialPort } from "./serialport-serialport";
-import { PenMotion, type Motion, Plan } from "./planning";
-import { formatDuration } from "./util";
+import { SerialPortSerialPort } from "./serialport-serialport.js";
+import { PenMotion, type Motion, Plan } from "./planning.js";
+import { formatDuration } from "./util.js";
 import { autoDetect } from '@serialport/bindings-cpp';
-import * as _self from './server';  // use self-import for test mocking
-
-import { EBB, type Hardware } from './ebb';
+import * as _self from './server.js';  // use self-import for test mocking
+import { EBB, type Hardware } from './ebb.js';
 
 type Com = string
 

src/ui.tsx

@@ -6,11 +6,11 @@ import colormap from "colormap";
 
 import { flattenSVG } from "flatten-svg";
 import { PaperSize } from "./paper-size";
-import { Device, Plan, type PlanOptions, defaultPlanOptions, XYMotion, PenMotion } from "./planning";
-import { formatDuration } from "./util";
-import type { Vec2 } from "./vec";
+import { Device, Plan, type PlanOptions, defaultPlanOptions, XYMotion, PenMotion } from "./planning.js";
+import { formatDuration } from "./util.js";
+import type { Vec2 } from "./vec.js";
 
-import PlanWorker from "./plan.worker";
+import PlanWorker from "./plan.worker.js";
 
 import "./style.css";
 

src/util.ts

@@ -1,5 +1,5 @@
-import type { PaperSize } from "./paper-size";
-import { vadd, type Vec2, vlen2, vmul, vsub } from "./vec";
+import type { PaperSize } from "./paper-size.js";
+import { vadd, type Vec2, vlen2, vmul, vsub } from "./vec.js";
 
 /** Format a smallish duration in 2h30m15s form */
 export function formatDuration(seconds: number): string {

tsconfig.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
-    "module": "commonjs",
+    "module": "ES2022",
     "esModuleInterop": true,
-    "target": "es6",
+    "target": "ES2022",
     "noImplicitAny": true,
     "moduleResolution": "node",
     "sourceMap": true,

tsconfig.web.json

@@ -2,8 +2,8 @@
   "compilerOptions": {
     "esModuleInterop": true,
     "noImplicitAny": true,
-    "module": "es6",
-    "target": "es6",
+    "module": "es2022",
+    "target": "es2022",
     "moduleResolution": "node",
     "jsx": "react",
     "allowJs": true