[M] Migrate to vite + ts

2024-12-15 22:08:46 -05:00
parent 2a9cb40e08
commit 2d40f304c7
16 changed files with 92 additions and 12235 deletions
@@ -1,86 +0,0 @@
-// eslint-disable-next-line no-undef
-module.exports = {
-  env: {
-    browser: true,
-    es2021: true,
-    es6: true,
-  },
-  extends: [
-    "plugin:react/recommended",
-    "prettier",
-    "plugin:prettier/recommended",
-    "plugin:react-hooks/recommended",
-    "plugin:import/recommended",
-  ],
-  parserOptions: {
-    ecmaFeatures: {
-      jsx: true,
-    },
-    ecmaVersion: "latest",
-    sourceType: "module",
-  },
-  plugins: ["react", "prettier", "react-hooks", "import"],
-  rules: {
-    "no-undef": "error",
-    "react/prop-types": "off",
-    "react/no-unescaped-entities": "warn",
-    "react-hooks/rules-of-hooks": "error",
-    "react-hooks/exhaustive-deps": "warn",
-    "no-unused-vars": "warn",
-    "func-names": "warn",
-    "object-shorthand": "off",
-    "class-methods-use-this": "off",
-    "consistent-return": "off",
-    "import/no-dynamic-require": "off",
-    "global-require": "off",
-    "jsx-a11y/click-events-have-key-events": "off",
-    "jsx-a11y/mouse-events-have-key-events": "off",
-    "max-classes-per-file": "off",
-    "no-nested-ternary": "off",
-    "no-new": "off",
-    "no-plusplus": "off",
-    "no-process-exit": "off",
-    "no-restricted-globals": "off",
-    "node/exports-style": "off",
-    "node/no-unpublished-import": "off",
-    "node/no-unsupported-features/es-syntax": "off",
-    "no-console": ["warn", {allow: ["warn", "debug", "error", "info"]}],
-    "no-unused-expressions": [
-      "error",
-      {
-        allowShortCircuit: true,
-        allowTernary: true,
-      },
-    ],
-    "react/no-array-index-key": "warn",
-    "no-shadow": "off",
-    "linebreak-style": ["error", "unix"],
-    "prettier/prettier": [
-      "error",
-      {
-        singleQuote: false,
-        parser: "flow",
-        bracketSpacing: false,
-        jsxBracketSameLine: false,
-        printWidth: 80,
-        semi: true,
-        tabWidth: 2,
-        trailingComma: "es5",
-        useTabs: false,
-        proseWrap: "always",
-        jsxSingleQuote: true,
-        importOrder: ["^[./]"],
-        importOrderSeparation: true,
-        importOrderSortSpecifiers: true,
-      },
-    ],
-  },
-  settings: {
-    "import/resolver": {
-      node: {
-        extensions: [".js", ".json"],
-      },
-    },
-    "import/ignore": ["node_modules", ".json$", ".(scss|css)$"],
-  },
-};
@@ -22,4 +22,5 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*

-*/.idea
+*/.idea
+.idea
@@ -29,16 +29,7 @@
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
+    <div id="app"></div>
+    <script type="module" src="/src/main.tsx"></script>
  </body>
 </html>
@@ -1,67 +1,20 @@
 {
  "name": "slither-link",
-  "version": "0.1.0",
  "private": true,
-  "dependencies": {
-    "@testing-library/jest-dom": "^5.16.3",
-    "@testing-library/react": "^12.1.4",
-    "@testing-library/user-event": "^13.5.0",
-    "gh-pages": "^3.2.3",
-    "husky": "^7.0.4",
-    "lint-staged": "^12.3.7",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-scripts": "5.0.0",
-    "sass": "^1.49.9",
-    "web-vitals": "^2.1.4"
-  },
-  "lint-staged": {
-    "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [
-      "prettier --write"
-    ]
-  },
+  "version": "0.0.0",
+  "type": "module",
  "scripts": {
-    "predeploy": "npm run build",
-    "deploy": "gh-pages -d build",
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview"
  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+  "dependencies": {
+    "preact": "^10.25.0"
  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
-  },
-  "homepage": "https://ameygohil.github.io/slither-link",
  "devDependencies": {
-    "eslint": "^8.11.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-eslint-plugin": "^4.1.0",
-    "eslint-plugin-import": "^2.25.4",
-    "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.29.4",
-    "eslint-plugin-react-hooks": "^4.3.0",
-    "prettier": "^2.6.0"
+    "@preact/preset-vite": "^2.9.1",
+    "sass-embedded": "^1.83.0",
+    "typescript": "~5.6.2",
+    "vite": "^6.0.1"
  }
 }
@@ -1,4 +1,4 @@
-body, html, #root {
+body, html, #app {
  height: 100%;
  width: 100%;
  box-sizing: border-box;
@@ -1,10 +0,0 @@
-import * as React from "react";
-
-import {render, screen} from "@testing-library/react";
-import App from "./App";
-
-test("renders learn react link", () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});
@@ -1,5 +1,3 @@
-import * as React from "react";
-
 import Game from "./components/Game";
 import "./App.css";

@@ -10,4 +10,4 @@ body {
 code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
-}
+}
@@ -0,0 +1,5 @@
+import { render } from 'preact'
+import './index.scss'
+import App from './App.tsx'
+
+render(<App />, document.getElementById('app')!)
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
@@ -0,0 +1,31 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+    "paths": {
+      "react": ["./node_modules/preact/compat/"],
+      "react-dom": ["./node_modules/preact/compat/"]
+    },
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
@@ -0,0 +1,7 @@
+{
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ]
+}
@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2022",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import preact from '@preact/preset-vite'
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [preact()],
+})