diff --git a/.gitignore b/.gitignore
index b12fea5d70e312d10f601849d302b2e9c79f183d..2e44a3c9ede6cc0ed892b32742b422b3ba021034 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,5 +5,4 @@ dist-ssr
 *.local
 package-lock.json
 yarn.lock
-.parcel-cache
 src-tauri/sidebar
diff --git a/package.json b/package.json
index e8e89d4f73a0cf46fdacf092fd8ede8807bcb4f5..f81c005b1c4a5f641d84b83b67611b2529741433 100644
--- a/package.json
+++ b/package.json
@@ -2,16 +2,17 @@
   "name": "clash-verge",
   "version": "0.0.0",
   "scripts": {
-    "dev": "tauri dev",
-    "build": "tauri build",
-    "web:dev": "parcel src/index.html -p 3000",
-    "web:build": "parcel build",
-    "tauri": "tauri"
+    "dev": "cargo tauri dev",
+    "build": "cargo tauri build",
+    "web:dev": "vite",
+    "web:build": "tsc && vite build",
+    "web:serve": "vite preview"
   },
   "dependencies": {
     "@emotion/react": "^11.7.0",
     "@emotion/styled": "^11.6.0",
-    "@material-ui/core": "^5.0.0-beta.5",
+    "@mui/icons-material": "^5.2.1",
+    "@mui/material": "^5.2.3",
     "@tauri-apps/api": "^1.0.0-beta.8",
     "axios": "^0.24.0",
     "react": "^17.0.0",
@@ -19,12 +20,11 @@
     "react-router-dom": "^6.0.2"
   },
   "devDependencies": {
-    "@parcel/transformer-sass": "^2.0.1",
-    "@tauri-apps/cli": "^1.0.0-beta.10",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
-    "parcel": "^2.0.1",
+    "@vitejs/plugin-react": "^1.1.1",
     "sass": "^1.44.0",
-    "typescript": "^4.5.2"
+    "typescript": "^4.5.2",
+    "vite": "^2.7.1"
   }
 }
diff --git a/src/index.html b/src/index.html
index d03124c94c5cf5adb770e988a4e41820e1c8973c..1fb0dd3054267abb6149752fb87f1a1588e49f54 100644
--- a/src/index.html
+++ b/src/index.html
@@ -3,10 +3,6 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      rel="stylesheet"
-      href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
-    />
     <title>Clash Verge</title>
   </head>
   <body>
diff --git a/vite.config.ts b/vite.config.ts
new file mode 100644
index 0000000000000000000000000000000000000000..28f78f6b5fe730d465cba3734eb71a6cba6fdab5
--- /dev/null
+++ b/vite.config.ts
@@ -0,0 +1,8 @@
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  root: "src",
+  plugins: [react()],
+});