chore(integrations): convert to TypeScript and add 'test:types' so each integration type checks against the published types (#12516)

* chore(integrations): convert to TypeScript and add 'test:types' so each integration type checks against the published types

* chore(integrations/react/webpack-4): use 'Node10' module resolution so 'test:types' checks the 'legacy' types webpack 4 resolves

Author: sukvvon

integrations/lit/vite/package.json

@@ -3,7 +3,8 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "tsc --noEmit && vite build"
+    "build": "vite build",
+    "test:types": "tsc --noEmit"
   },
   "dependencies": {
     "@tanstack/lit-query": "workspace:*",

integrations/preact/vite/index.html

@@ -6,6 +6,6 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>

integrations/preact/vite/package.json

@@ -3,13 +3,17 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "vite build"
+    "build": "vite build",
+    "test:types": "tsc --noEmit"
   },
   "dependencies": {
     "@preact/preset-vite": "^2.10.6",
     "@tanstack/preact-query": "workspace:*",
     "@tanstack/preact-query-devtools": "workspace:*",
     "preact": "^11.0.1",
     "vite": "^8.3.5"
+  },
+  "devDependencies": {
+    "typescript": "^6.0.3"
   }
 }

integrations/preact/vite/src/App.jsx integrations/preact/vite/src/App.tsxintegrations/preact/vite/src/App.jsx renamed to integrations/preact/vite/src/App.tsx

@@ -1,7 +1,7 @@
 import { render } from 'preact'
 import { QueryClient, QueryClientProvider } from '@tanstack/preact-query'
 import { PreactQueryDevtools } from '@tanstack/preact-query-devtools'
-import App from './App.jsx'
+import App from './App'
 
 const queryClient = new QueryClient()
 
@@ -10,5 +10,5 @@ render(
     <App />
     <PreactQueryDevtools />
   </QueryClientProvider>,
-  document.getElementById('root'),
+  document.getElementById('root')!,
 )

integrations/preact/vite/src/main.jsx integrations/preact/vite/src/main.tsxintegrations/preact/vite/src/main.jsx renamed to integrations/preact/vite/src/main.tsx

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "jsxImportSource": "preact",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src", "*.config.ts"]
+}

integrations/preact/vite/tsconfig.json

@@ -6,6 +6,6 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
+    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>

integrations/preact/vite/vite.config.js integrations/preact/vite/vite.config.tsintegrations/preact/vite/vite.config.js renamed to integrations/preact/vite/vite.config.ts

@@ -3,7 +3,8 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "vite build"
+    "build": "vite build",
+    "test:types": "tsc --noEmit"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",
@@ -12,5 +13,10 @@
     "react": "^19.3.1",
     "react-dom": "^19.3.1",
     "vite": "^8.3.5"
+  },
+  "devDependencies": {
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "typescript": "^6.0.3"
   }
 }

integrations/react/vite/index.html

@@ -1,4 +1,3 @@
-import React from 'react'
 import { useQuery } from '@tanstack/react-query'
 
 const App = () => {