build: migrate to Rsbuild

tien · Nov 21, 2024 · 5c2d7f2 · 5c2d7f2
1 parent 3baee90
commit 5c2d7f2
Show file tree

Hide file tree

Showing 11 changed files with 314 additions and 748 deletions.
diff --git a/.env.example b/.env.example
@@ -1 +1 @@
-VITE_APP_WALLET_CONNECT_PROJECT_ID=
+PUBLIC_WALLET_CONNECT_PROJECT_ID=
diff --git a/.github/workflows/deployment.yml b/.github/workflows/deployment.yml
@@ -21,7 +21,7 @@ jobs:
       - run: yarn install --immutable
       - run: yarn build
         env:
-          VITE_APP_WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+          PUBLIC_WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
 
       # There's a bug on version 1.4.1
       # change this back to latest version after

diff --git a/package.json b/package.json
@@ -20,10 +20,10 @@
     "yarn": "4.3.1"
   },
   "scripts": {
-    "dev": "vite",
-    "build": "vite build",
+    "dev": "rsbuild dev",
+    "build": "rsbuild build",
     "lint": "eslint src",
-    "preview": "vite preview",
+    "preview": "rsbuild preview",
     "postinstall": "papi && panda codegen"
   },
   "dependencies": {
@@ -39,7 +39,7 @@
     "@tanstack/react-router": "^1.82.1",
     "@w3f/polkadot-icons": "^1.0.0",
     "date-fns": "^4.1.0",
-    "dot-connect": "^0.12.1",
+    "dot-connect": "^0.13.0",
     "dot-identicon": "^0.1.0",
     "jotai": "^2.10.3",
     "polkadot-api": "^1.7.6",
@@ -53,22 +53,21 @@
     "@eslint/js": "^9.15.0",
     "@pandacss/dev": "^0.48.0",
     "@park-ui/panda-preset": "^0.43.0",
+    "@rsbuild/core": "^1.1.4",
+    "@rsbuild/plugin-react": "^1.0.7",
     "@tanstack/router-devtools": "^1.82.1",
     "@tanstack/router-plugin": "^1.81.9",
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
+    "@tsconfig/recommended": "^1.0.8",
     "@tsconfig/strictest": "^2.0.5",
-    "@tsconfig/vite-react": "^3.0.2",
     "@types/eslint__js": "^8.42.3",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
-    "@vitejs/plugin-react": "^4.3.3",
     "eslint": "^9.15.0",
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.0.0",
     "prettier": "^3.3.3",
     "typescript": "^5.6.3",
-    "typescript-eslint": "^8.15.0",
-    "vite": "^5.4.11",
-    "vite-tsconfig-paths": "^5.1.3"
+    "typescript-eslint": "^8.15.0"
   }
 }
diff --git a/rsbuild.config.ts b/rsbuild.config.ts
@@ -0,0 +1,20 @@
+import { defineConfig } from "@rsbuild/core";
+import { pluginReact } from "@rsbuild/plugin-react";
+import { TanStackRouterRspack } from "@tanstack/router-plugin/rspack";
+
+export default defineConfig({
+  plugins: [pluginReact()],
+  tools: {
+    rspack: {
+      plugins: [TanStackRouterRspack()],
+    },
+  },
+  html: {
+    template: "./src/index.html",
+  },
+  source: {
+    entry: {
+      index: "./src/index.tsx",
+    },
+  },
+});
diff --git a/src/config.ts b/src/config.ts
@@ -101,7 +101,7 @@ export const config = defineConfig({
     new InjectedWalletProvider(),
     new LedgerWallet(),
     new WalletConnect({
-      projectId: import.meta.env.VITE_APP_WALLET_CONNECT_PROJECT_ID,
+      projectId: import.meta.env.PUBLIC_WALLET_CONNECT_PROJECT_ID,
       providerOptions: {
         metadata: {
           name: "ĐÓTConsole",

diff --git a/index.html → src/index.html b/index.html → src/index.html
@@ -12,6 +12,5 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="./src/index.tsx"></script>
   </body>
 </html>
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
@@ -1,7 +1,7 @@
-/// <reference types="vite/client" />
+/// <reference types="@rsbuild/core/types" />
 
 interface ImportMetaEnv {
-  readonly VITE_APP_WALLET_CONNECT_PROJECT_ID: string;
+  readonly PUBLIC_WALLET_CONNECT_PROJECT_ID: string;
 }
 
 interface ImportMeta {

diff --git a/tsconfig.json b/tsconfig.json
@@ -1,10 +1,13 @@
 {
   "extends": [
-    "@tsconfig/strictest/tsconfig.json",
-    "@tsconfig/vite-react/tsconfig.json"
+    "@tsconfig/recommended/tsconfig.json",
+    "@tsconfig/strictest/tsconfig.json"
   ],
   "compilerOptions": {
-    "lib": ["ESNext"],
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "react-jsx",
     "baseUrl": ".",
     "paths": {
       "~/*": ["./src/*"]

diff --git a/tsconfig.node.json b/tsconfig.node.json
@@ -6,6 +6,5 @@
     "moduleResolution": "bundler",
     "allowSyntheticDefaultImports": true,
     "strict": true
-  },
-  "include": ["vite.config.ts"]
+  }
 }
diff --git a/vite.config.ts b/vite.config.ts
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		VITE_APP_WALLET_CONNECT_PROJECT_ID=
		PUBLIC_WALLET_CONNECT_PROJECT_ID=
-Original file line number
+Diff line change
@@ Expand Up / @@ -12,6 +12,5 @@ @@
       </head>
       <body>
         <div id="root"></div>
-        <script type="module" src="./src/index.tsx"></script>
       </body>
     </html>