refactor: use voidzero-dev/setup-vite-plus-action to install vite+ cli (#123)

* refactor: use voidzero-dev/setup-vite-plus-action to install vite+ cli

* FIXUP

* FIXUP

Author: fengmk2

.github/workflows/ci.yml

@@ -26,21 +26,33 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
 
-      - name: Setup Node.js and pnpm
-        uses: ./.github/actions/setup-node-pnpm
+      - name: Setup Node.js
+        uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6
+        with:
+          node-version: "lts/*"
+          package-manager-cache: false
+          check-latest: true
+
+      - name: Setup Vite+
+        uses: voidzero-dev/setup-vite-plus-action@8e5c964eecdefb1a599d79ad0c4a00418e193e72 # v1
+        with:
+          cache: true
+          registry: github
+          github-token: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Install Playwright browsers
-        run: pnpm exec playwright install chromium
+        run: npx playwright install chromium
 
       - name: Check ready
         run: |
-          pnpm ready
+          vite run ready
           # run again to check cache hits
-          pnpm ready
-        env:
-          VITE_LOG: 'trace'
+          vite run ready
+        # env:
+        #   VITE_LOG: 'trace'
 
       - name: Check build artifacts
+        if: ${{ matrix.os != 'windows-latest' }}
         run: |
           if [ -d "apps/dashboard/dist" ]; then
             echo "✅ Build artifacts created successfully"
@@ -49,41 +61,3 @@ jobs:
             echo "❌ Build artifacts not found"
             exit 1
           fi
-
-  global:
-    timeout-minutes: 15
-    permissions:
-      contents: read
-      packages: read
-
-    strategy:
-      fail-fast: false
-      matrix:
-        os: [ubuntu-latest, macos-latest, windows-latest]
-
-    runs-on: ${{ matrix.os }}
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
-
-      - name: Setup Node.js and pnpm
-        uses: ./.github/actions/setup-node-pnpm
-
-      - uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
-        with:
-          node-version: 'lts/*'
-          registry-url: 'https://npm.pkg.github.com'
-          scope: '@voidzero-dev'
-          package-manager-cache: false
-
-      - run: npm install -g @voidzero-dev/global@latest
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-      
-      - run: vite --version
-      - run: vite fmt -c .oxfmtrc.jsonc --check
-
-      - run: vite lint -c .oxlintrc.json
-        env:
-          VITE_LOG: 'trace'

.oxfmtrc.jsonc

@@ -29,12 +29,11 @@
     "@types/react-dom": "^19.1.7",
     "@types/react-router-dom": "^5.3.3",
     "@types/semver": "^7.7.1",
-    "@vitest/browser": "^4.0.9",
-    "@vitest/browser-playwright": "^4.0.9",
     "@vitest/ui": "^4.0.9",
     "playwright": "^1.55.0",
     "vite": "catalog:",
     "tailwindcss": "^4.1.13",
-    "typescript": "catalog:"
+    "typescript": "catalog:",
+    "@voidzero-dev/vite-plus": "catalog:"
   }
 }

apps/dashboard/package.json

@@ -1,6 +1,6 @@
 import { render } from "@testing-library/react";
 import { MemoryRouter } from "react-router-dom";
-import { describe, expect, it } from "vitest";
+import { describe, expect, it } from "@voidzero-dev/vite-plus/test";
 import App from "../App";
 import MinificationBenchmarksPage from "../pages/MinificationBenchmarksPage";
 import NpmPackagesPage from "../pages/NpmPackagesPage";

apps/dashboard/src/__tests__/pages.test.tsx

@@ -12,7 +12,11 @@ export function AppBar({ title, subtitle }: AppBarProps) {
       <div className="h-full flex items-center justify-between">
         {/* Left side - Page title */}
         <div>
-          {title && <h2 className="text-xl font-semibold bg-gradient-to-r from-slate-900 to-slate-700 dark:from-white dark:to-slate-300 bg-clip-text text-transparent">{title}</h2>}
+          {title && (
+            <h2 className="text-xl font-semibold bg-gradient-to-r from-slate-900 to-slate-700 dark:from-white dark:to-slate-300 bg-clip-text text-transparent">
+              {title}
+            </h2>
+          )}
           {subtitle && <p className="text-sm text-slate-500 dark:text-slate-400">{subtitle}</p>}
         </div>
 

apps/dashboard/src/components/layout/AppBar.tsx

@@ -86,7 +86,9 @@ export function Sidebar() {
             </div>
             {!collapsed && (
               <div>
-                <h1 className="font-bold bg-gradient-to-r from-slate-900 to-slate-700 dark:from-white dark:to-slate-300 bg-clip-text text-transparent">Vibe</h1>
+                <h1 className="font-bold bg-gradient-to-r from-slate-900 to-slate-700 dark:from-white dark:to-slate-300 bg-clip-text text-transparent">
+                  Vibe
+                </h1>
                 <p className="text-xs text-slate-500 dark:text-slate-400">Dashboard</p>
               </div>
             )}

apps/dashboard/src/components/layout/Sidebar.tsx

@@ -10,11 +10,7 @@ const SidebarContext = createContext<SidebarContextType | undefined>(undefined);
 export function SidebarProvider({ children }: { children: React.ReactNode }) {
   const [collapsed, setCollapsed] = useState(false);
 
-  return (
-    <SidebarContext.Provider value={{ collapsed, setCollapsed }}>
-      {children}
-    </SidebarContext.Provider>
-  );
+  return <SidebarContext.Provider value={{ collapsed, setCollapsed }}>{children}</SidebarContext.Provider>;
 }
 
 export function useSidebar() {

apps/dashboard/src/context/SidebarContext.tsx

@@ -82,11 +82,15 @@ function HomePage() {
           const colors = getColorClasses(feature.color);
           return (
             <Link key={feature.link} to={feature.link}>
-              <Card className={`h-full transition-all hover:shadow-2xl hover:scale-[1.02] ${colors.hover} cursor-pointer group relative overflow-hidden`}>
+              <Card
+                className={`h-full transition-all hover:shadow-2xl hover:scale-[1.02] ${colors.hover} cursor-pointer group relative overflow-hidden`}
+              >
                 <div className="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-slate-100/50 dark:to-slate-700/30 opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
                 <div className="p-6 relative z-10">
                   <div className="flex items-start gap-4">
-                    <div className={`p-3 rounded-xl ${colors.bg} shadow-sm group-hover:shadow-md transition-all group-hover:scale-110`}>
+                    <div
+                      className={`p-3 rounded-xl ${colors.bg} shadow-sm group-hover:shadow-md transition-all group-hover:scale-110`}
+                    >
                       <div className={colors.icon}>{feature.icon}</div>
                     </div>
                     <div className="flex-1">

apps/dashboard/src/pages/HomePage.tsx

@@ -1,5 +1,5 @@
 import tailwindcss from "@tailwindcss/vite";
-import { playwright } from "@vitest/browser-playwright";
+import { playwright } from "@voidzero-dev/vite-plus/test/browser-playwright";
 import { defineConfig } from "@voidzero-dev/vite-plus";
 
 // https://vite.dev/config/

apps/dashboard/vite.config.ts

@@ -6,20 +6,20 @@
   "packageManager": "pnpm@10.26.0",
   "type": "module",
   "scripts": {
-    "ready": "vite fmt && vite lint --type-aware --threads 4 && vite test && vite run build",
-    "dev": "pnpm --filter dashboard dev",
+    "ready": "vite run fmt --check && vite run lint && vite run test && vite run build && vite run -r typecheck",
+    "dev": "vite run @vibe/dashboard#dev",
     "build": "vite run @vibe/dashboard#build",
-    "lint": "vite lint --type-aware --threads 4",
+    "lint": "vite lint --type-aware --type-check --threads 4",
     "test": "vite test",
     "fmt": "vite fmt",
     "generate": "node tools/override-rolldown.mjs --stats"
   },
   "devDependencies": {
     "@typescript-eslint/scope-manager": "^8.47.0",
-    "@voidzero-dev/vite-plus": "latest",
+    "@voidzero-dev/vite-plus": "catalog:",
     "dprint": "^0.50.2",
     "playwright": "^1.56.1",
     "top-github-dependents-by-stars": "^1.0.4",
-    "vitest": "^4.0.14"
+    "vitest": "catalog:"
   }
 }