chore: Update tsconfig and build script (#981)

### Change list

- Various tsconfig and build script updates, mostly prompted by AI
feedback

Author: kylebarron

build.mjs

@@ -9,25 +9,29 @@ import tailwindcss from "tailwindcss";
 // Load environment variables from .env file
 dotenv.config();
 
+const node_env = process.env.NODE_ENV || "production";
+
 // List of environment variables to expose to the build
-const env = {
+const defineEnv = {
+  // Ref https://github.com/manzt/anywidget/issues/369#issuecomment-1792376003
+  "define.amd": "false",
+  "process.env.NODE_ENV": node_env,
   "process.env.XSTATE_INSPECT": JSON.stringify(
     process.env.XSTATE_INSPECT || "false",
   ),
 };
 
 esbuild.build({
   entryPoints: ["./src/index.tsx"],
-  bundle: true,
-  minify: true,
-  target: ["es2022"],
   outdir: "lonboard/static/",
+  bundle: true,
   format: "esm",
-  // Ref https://github.com/manzt/anywidget/issues/369#issuecomment-1792376003
-  define: {
-    "define.amd": "false",
-    ...env,
-  },
+  target: ["es2022"],
+  // Build sourcemaps when not in prod
+  sourcemap: node_env !== "production",
+  // Minify only in prod
+  minify: node_env === "production",
+  define: defineEnv,
   plugins: [
     sassPlugin({
       async transform(source) {
@@ -40,6 +44,7 @@ esbuild.build({
       },
     }),
   ],
+  platform: "browser",
   loader: {
     ".worker.js": "text",
     ".worker.min.js": "text",

eslint.config.js

@@ -8,6 +8,11 @@ import tseslint from "typescript-eslint";
 export default [
   { files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"] },
   { languageOptions: { globals: globals.browser } },
+  // Esbuild build script should have access to Node globals
+  {
+    files: ["build.mjs"],
+    languageOptions: { globals: globals.node },
+  },
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
   pluginReact.configs.flat.recommended,

package.json

@@ -73,7 +73,8 @@
   },
   "scripts": {
     "build": "node ./build.mjs",
-    "build:watch": "nodemon --watch src/ --exec \"npm run build\" --ext js,json,ts,tsx,css",
+    "build:dev": "NODE_ENV=development node ./build.mjs",
+    "build:watch": "nodemon --watch src/ --exec \"npm run build:dev\" --ext js,json,ts,tsx,css",
     "prettier:check": "prettier './src/**/*.{ts,tsx,css}' --check",
     "prettier": "prettier './src/**/*.{ts,tsx,css}' --write",
     "lint": "eslint src",

tsconfig.json

@@ -2,23 +2,26 @@
   "include": ["src/**/*"],
   "exclude": ["node_modules"],
   "compilerOptions": {
+    "module": "esnext",
     "moduleResolution": "node",
-    "module": "ES2022",
-    "outDir": "./dist",
-    "allowJs": true,
     "target": "ES2022",
+
+    "outDir": "./dist",
+    "rootDir": "src",
     "declaration": true,
+    "declarationMap": true,
+    "sourceMap": true,
+
+    "strict": true,
+    "skipLibCheck": true,
+    "strictNullChecks": true,
+
     "noEmit": false,
     "noEmitOnError": false,
-    "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
-    "jsx": "react",
-    "skipLibCheck": true,
-    "strict": true,
-    "strictNullChecks": true,
-    // "lib": [
-    //   "es2019.array", "es6", "dom"
-    // ],
-    "rootDir": "."
+    "esModuleInterop": true,
+
+    "jsx": "react-jsx",
+    "allowJs": true
   }
 }