Enable JSX processing and add Prettier

But don't run Prettier on any files yet.

eslint.config.js

@@ -1,24 +1,37 @@
-import vitest from "@vitest/eslint-plugin";
 import js from '@eslint/js';
+import vitest from '@vitest/eslint-plugin';
+import prettier from 'eslint-config-prettier';
 import globals from 'globals';
 
 /** @type {import('eslint').Linter.Config[]} */
 export default [
   js.configs.recommended,
+  prettier,
   {
+    files: ['**/*.js', '**/*.jsx'],
     languageOptions: {
       globals: {
         ...globals.browser,
         ...globals.node
       }
     },
     rules: {
-      'no-unused-vars': 'off',
-      '@typescript-eslint/no-unused-vars': 'off'
+      'no-unused-vars': 'off'
     }
   },
+  // Enable parsing of JSX syntax
   {
-    files: ["test/*.js"],
+    files: ['**/*.jsx'],
+    languageOptions: {
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
+      }
+    }
+  },
+  {
+    files: ['test/*.js'],
     languageOptions: {
       globals: {
         ...vitest.environments.env.globals

package.json

@@ -32,15 +32,20 @@
     "workbox-window": "^7.1.0"
   },
   "devDependencies": {
+    "@eslint/js": "^9.9.0",
     "@testing-library/jest-dom": "^6.4.6",
+    "@types/eslint-config-prettier": "^6.11.3",
+    "@types/eslint__js": "^8.42.3",
     "@types/node": "^20.14.10",
     "@vitest/coverage-v8": "^2.0.1",
     "@vitest/eslint-plugin": "^1.0.3",
     "eslint": "^9.9.0",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-jest": "^28.8.0",
     "globals": "^15.9.0",
     "idb-keyval": "^6.2.1",
     "jsdom": "^24.1.0",
+    "prettier": "^3.3.3",
     "sass": "^1.77.6",
     "vite": "^5.3.3",
     "vitest": "^2.0.1",

vite.config.js

@@ -8,6 +8,15 @@ export default defineConfig({
   // projects domain (e.g. https://projects.calebevans.me/truthy/), we must
   // specify . as the base directory to serve from
   base: './',
+    // Enable JSX processing
+  esbuild: {
+    // We need to use _m as the imported name so that it doesn't collide with
+    // explicitly importing _m, while still allowing us to have organizeImports
+    // strip out "unused" mithril imports
+    jsxInject: "import _m from 'mithril'",
+    jsxFactory: '_m',
+    jsxFragment: '_m.Fragment'
+  },
   plugins: [
     VitePWA({
       filename: 'service-worker.js',