From 4bbaafb9d96b039c5a85cb4622d7ae37814a888a Mon Sep 17 00:00:00 2001
From: Simirall <37952374+Simirall@users.noreply.github.com>
Date: Sat, 13 Jul 2024 10:30:51 +0000
Subject: [PATCH] tsr devtool only development
---
frontend/package.json | 3 ++-
frontend/pnpm-lock.yaml | 38 ++++++++++++++++++++++++----------
frontend/src/routes/__root.tsx | 16 ++++++++++++--
3 files changed, 43 insertions(+), 14 deletions(-)
diff --git a/frontend/package.json b/frontend/package.json
index 04758536..59f5496b 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -10,7 +10,7 @@
"dev": "vite",
"build": "pnpm run generate-routes && pnpm run generate-html-template && tsc -b && vite build && node ./scripts/generate-ejs.js",
"preview": "vite preview",
- "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+ "lint": "eslint . --ext ts,tsx --max-warnings 0",
"lint:fix": "pnpm lint --fix",
"format": "prettier --write src/**/*.{js,jsx,ts,tsx,css,scss}"
},
@@ -26,6 +26,7 @@
"devDependencies": {
"@tanstack/router-cli": "^1.43.1",
"@tanstack/router-plugin": "^1.43.1",
+ "@types/node": "^20.14.10",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@typescript-eslint/eslint-plugin": "^7.13.1",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index c3985aa2..6de47fcf 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -35,7 +35,10 @@ importers:
version: 1.43.1
'@tanstack/router-plugin':
specifier: ^1.43.1
- version: 1.43.1(vite@5.3.1)
+ version: 1.43.1(vite@5.3.1(@types/node@20.14.10))
+ '@types/node':
+ specifier: ^20.14.10
+ version: 20.14.10
'@types/react':
specifier: ^18.3.3
version: 18.3.3
@@ -50,7 +53,7 @@ importers:
version: 7.13.1(eslint@8.57.0)(typescript@5.5.2)
'@vitejs/plugin-react-swc':
specifier: ^3.7.0
- version: 3.7.0(vite@5.3.1)
+ version: 3.7.0(vite@5.3.1(@types/node@20.14.10))
eslint:
specifier: ^8.57.0
version: 8.57.0
@@ -83,10 +86,10 @@ importers:
version: 5.5.2
vite:
specifier: ^5.3.1
- version: 5.3.1
+ version: 5.3.1(@types/node@20.14.10)
vite-tsconfig-paths:
specifier: ^4.3.2
- version: 4.3.2(typescript@5.5.2)(vite@5.3.1)
+ version: 4.3.2(typescript@5.5.2)(vite@5.3.1(@types/node@20.14.10))
packages:
@@ -662,6 +665,9 @@ packages:
'@types/json5@0.0.29':
resolution: {integrity: sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==}
+ '@types/node@20.14.10':
+ resolution: {integrity: sha512-MdiXf+nDuMvY0gJKxyfZ7/6UFsETO7mGKF54MVD/ekJS6HdFtpZFBgrh6Pseu64XTb2MLyFPlbW6hj8HYRQNOQ==}
+
'@types/prop-types@15.7.12':
resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==}
@@ -1884,6 +1890,9 @@ packages:
unbox-primitive@1.0.2:
resolution: {integrity: sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==}
+ undici-types@5.26.5:
+ resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+
unplugin@1.10.2:
resolution: {integrity: sha512-KuPqnjU4HBcrSwmQatfdc5hU4xzaQrhoKqCKylwmLnbBvqj5udXL8cHrkOuYDoI4ESCwJIiAIKMujroIUKLgow==}
engines: {node: '>=14.0.0'}
@@ -2518,7 +2527,7 @@ snapshots:
prettier: 3.3.2
zod: 3.23.8
- '@tanstack/router-plugin@1.43.1(vite@5.3.1)':
+ '@tanstack/router-plugin@1.43.1(vite@5.3.1(@types/node@20.14.10))':
dependencies:
'@babel/core': 7.24.7
'@babel/generator': 7.24.7
@@ -2537,7 +2546,7 @@ snapshots:
unplugin: 1.10.2
zod: 3.23.8
optionalDependencies:
- vite: 5.3.1
+ vite: 5.3.1(@types/node@20.14.10)
transitivePeerDependencies:
- supports-color
@@ -2568,6 +2577,10 @@ snapshots:
'@types/json5@0.0.29': {}
+ '@types/node@20.14.10':
+ dependencies:
+ undici-types: 5.26.5
+
'@types/prop-types@15.7.12': {}
'@types/react-dom@18.3.0':
@@ -2662,10 +2675,10 @@ snapshots:
'@ungap/structured-clone@1.2.0': {}
- '@vitejs/plugin-react-swc@3.7.0(vite@5.3.1)':
+ '@vitejs/plugin-react-swc@3.7.0(vite@5.3.1(@types/node@20.14.10))':
dependencies:
'@swc/core': 1.6.5
- vite: 5.3.1
+ vite: 5.3.1(@types/node@20.14.10)
transitivePeerDependencies:
- '@swc/helpers'
@@ -4018,6 +4031,8 @@ snapshots:
has-symbols: 1.0.3
which-boxed-primitive: 1.0.2
+ undici-types@5.26.5: {}
+
unplugin@1.10.2:
dependencies:
acorn: 8.12.0
@@ -4071,23 +4086,24 @@ snapshots:
dependencies:
react: 18.3.1
- vite-tsconfig-paths@4.3.2(typescript@5.5.2)(vite@5.3.1):
+ vite-tsconfig-paths@4.3.2(typescript@5.5.2)(vite@5.3.1(@types/node@20.14.10)):
dependencies:
debug: 4.3.5
globrex: 0.1.2
tsconfck: 3.1.0(typescript@5.5.2)
optionalDependencies:
- vite: 5.3.1
+ vite: 5.3.1(@types/node@20.14.10)
transitivePeerDependencies:
- supports-color
- typescript
- vite@5.3.1:
+ vite@5.3.1(@types/node@20.14.10):
dependencies:
esbuild: 0.21.5
postcss: 8.4.38
rollup: 4.18.0
optionalDependencies:
+ '@types/node': 20.14.10
fsevents: 2.3.3
webpack-sources@3.2.3: {}
diff --git a/frontend/src/routes/__root.tsx b/frontend/src/routes/__root.tsx
index c35a6178..47dd2eee 100644
--- a/frontend/src/routes/__root.tsx
+++ b/frontend/src/routes/__root.tsx
@@ -1,5 +1,5 @@
import { createRootRoute, Outlet } from "@tanstack/react-router";
-import { TanStackRouterDevtools } from "@tanstack/router-devtools";
+import { lazy, Suspense } from "react";
import type { OpenGraphProtocolType } from "@/staticDataRouteOption";
@@ -10,7 +10,9 @@ export const Route = createRootRoute({
<>
-
+
+
+
>
),
staticData: {
@@ -22,3 +24,13 @@ export const Route = createRootRoute({
},
},
});
+
+const TanStackRouterDevtools =
+ process.env.NODE_ENV === "production"
+ ? () => null // Render nothing in production
+ : lazy(() =>
+ // Lazy load in development
+ import("@tanstack/router-devtools").then((res) => ({
+ default: res.TanStackRouterDevtools,
+ })),
+ );