Changes to migrate to Vite

reznik99 · Jun 22, 2024 · 02b88be · 02b88be
1 parent 6c900a3
commit 02b88be
Show file tree

Hide file tree

Showing 8 changed files with 4,045 additions and 28,054 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="utf-8" />
+ <link rel="icon" href="favicon.ico" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <meta name="theme-color" content="#000000" />
+ <meta name="description" content="Cryptographic tools in your browser!" />
+ <link rel="apple-touch-icon" href="logo192.png" />
+ <!--
+ manifest.json provides metadata used when your web app is installed on a
+ user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+ -->
+ <link rel="manifest" href="manifest.json" />
+ <title>CryptoTools</title>
+</head>
+
+<body>
+ <noscript>You need to enable JavaScript to run this app.</noscript>
+ <div id="root"></div>
+ <script type="module" src="/src/index.jsx"></script>
+ <script src="wasm_exec.js"></script>
+ <script>
+ const go = new Go();
+ WebAssembly.instantiateStreaming(fetch("test.wasm"), go.importObject).then((result) => {
+ go.run(result.instance);
+ });
+ </script>
+</body>
+
+</html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -4,12 +4,17 @@
  "license": "GPL-3.0-or-later",
  "private": true,
  "homepage": "",
+ "scripts": {
+ "start": "vite",
+ "build": "tsc && vite build"
+ },
  "dependencies": {
  "@emotion/react": "^11.11.4",
  "@emotion/styled": "^11.11.5",
  "@fontsource/roboto": "^5.0.13",
  "@mui/icons-material": "^5.15.20",
  "@mui/material": "^5.15.20",
+ "@vitejs/plugin-react-swc": "^3.7.0",
  "asn1js": "^3.0.5",
  "bootstrap": "^5.3.3",
  "bootstrap-icons": "^1.11.3",
@@ -19,20 +24,18 @@
  "react-bootstrap": "^2.10.2",
  "react-dom": "^18.2.0",
  "react-router-dom": "^6.22.3",
- "react-scripts": "5.0.1"
+ "vite": "^5.3.1",
+ "vite-plugin-svgr": "^4.2.0",
+ "vite-plugin-top-level-await": "^1.4.1"
  },
  "devDependencies": {
  "@types/node": "^20.11.30",
  "@types/react": "^18.2.79",
  "@types/react-bootstrap": "^0.32.36",
  "@types/react-dom": "^18.2.25",
- "typescript": "^4.9.5"
- },
- "scripts": {
- "start": "react-scripts start",
- "build": "react-scripts build",
- "test": "react-scripts test",
- "eject": "react-scripts eject"
+ "typescript": "^4.9.5",
+ "vite-plugin-wasm": "^3.3.0",
+ "vite-tsconfig-paths": "^4.3.2"
  },
  "eslintConfig": {
  "extends": [

diff --git a/public/index.html b/public/index.html
diff --git a/src/index.js → src/index.jsx b/src/index.js → src/index.jsx
@@ -12,7 +12,7 @@ import '@fontsource/roboto/700.css';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap-icons/font/bootstrap-icons.css';
 import './index.css';
-import App from './App';
+import App from './App.tsx';
 
 const darkTheme = createTheme({
  palette: {

diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,11 +1,22 @@
 {
  "compilerOptions": {
- "esModuleInterop": true,
- "jsx": "react",
- "strict": true,
- "baseUrl": "src"
+ "target": "ESNext",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": false,
+ "skipLibCheck": true,
+ "esModuleInterop": true,
+ "allowSyntheticDefaultImports": true,
+ "strict": true,
+ "forceConsistentCasingInFileNames": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "noEmit": true,
+ "noFallthroughCasesInSwitch": true,
+ "jsx": "react-jsx",
+ "types": ["vite/client", "vite-plugin-svgr/client"],
+ "baseUrl": "src"
  },
- "include": [
- "src"
- ]
-}
+ "include": ["src", "wasm_exec.js"]
+ }
diff --git a/vite.config.ts b/vite.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react-swc'
+import tsconfigPaths from 'vite-tsconfig-paths'
+import wasm from "vite-plugin-wasm"
+import topLevelAwait from "vite-plugin-top-level-await"
+
+// https://vitejs.dev/config/
+export default defineConfig({
+ base: '',
+ plugins: [react(), tsconfigPaths(), wasm(), topLevelAwait()]
+})