chore: Add type checking to integrations (TanStack#6607)

* Add TS to vue-vite integration * Explicitly exclude examples * Merge test:bundle into build * Update gitignore * Update codesandbox build step * Wow npm is annoying
ardeora · Dec 28, 2023 · ddf5539 · ddf5539
1 parent 9f2c148
commit ddf5539
Show file tree

Hide file tree

Showing 22 changed files with 77 additions and 32 deletions.
diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
@@ -1,6 +1,6 @@
 {
   "installCommand": "install:csb",
-  "buildCommand": "build:all",
+  "buildCommand": "build:all -- --exclude=integrations/**",
   "sandboxes": [
     "/examples/angular/basic",
     "/examples/react/basic-typescript",

diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -48,7 +48,7 @@ jobs:
       - name: Start CI Orchestrator
         run: npx nx-cloud start-ci-run
       - name: Run Tests
-        run: npx nx affected --targets=test:eslint,test:lib,test:types,test:build,test:bundle
+        run: pnpm run test:pr
       - name: Stop Agents
         if: ${{ always() }}
         run: npx nx-cloud stop-all-agents

diff --git a/.gitignore b/.gitignore
@@ -10,6 +10,7 @@ pnpm-lock.yaml
 # builds
 types
 */**/.svelte-kit
+*/**/.tsup
 */**/build
 */**/dist
 */**/lib

diff --git a/integrations/angular-cli-standalone-17/package.json b/integrations/angular-cli-standalone-17/package.json
@@ -2,7 +2,7 @@
   "name": "angular-cli-standalone-17",
   "version": "0.0.0",
   "scripts": {
-    "test:bundle": "ng build"
+    "build": "ng build"
   },
   "private": true,
   "dependencies": {

diff --git a/integrations/react-cra4/package.json b/integrations/react-cra4/package.json
@@ -2,7 +2,7 @@
   "name": "react-cra4",
   "private": true,
   "scripts": {
-    "test:bundle": "cross-env DISABLE_ESLINT_PLUGIN=true SKIP_PREFLIGHT_CHECK=true NODE_OPTIONS=--openssl-legacy-provider react-scripts build"
+    "build": "cross-env DISABLE_ESLINT_PLUGIN=true SKIP_PREFLIGHT_CHECK=true NODE_OPTIONS=--openssl-legacy-provider react-scripts build"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",

diff --git a/integrations/react-cra5/package.json b/integrations/react-cra5/package.json
@@ -2,7 +2,7 @@
   "name": "react-cra5",
   "private": true,
   "scripts": {
-    "test:bundle": "cross-env DISABLE_ESLINT_PLUGIN=true react-scripts build"
+    "build": "cross-env DISABLE_ESLINT_PLUGIN=true react-scripts build"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",

diff --git a/integrations/react-next/package.json b/integrations/react-next/package.json
@@ -2,7 +2,7 @@
   "name": "react-next",
   "private": true,
   "scripts": {
-    "test:bundle": "next build"
+    "build": "next build"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",

diff --git a/integrations/react-vite4/package.json b/integrations/react-vite4/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "test:bundle": "vite build"
+    "build": "vite build"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",

diff --git a/integrations/react-vite5/package.json b/integrations/react-vite5/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "test:bundle": "vite build"
+    "build": "vite build"
   },
   "dependencies": {
     "@tanstack/react-query": "workspace:*",

diff --git a/integrations/solid-vite/package.json b/integrations/solid-vite/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "test:bundle": "vite build"
+    "build": "vite build"
   },
   "dependencies": {
     "@tanstack/solid-query": "workspace:*",

diff --git a/integrations/svelte-vite/package.json b/integrations/svelte-vite/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "test:bundle": "vite build"
+    "build": "vite build"
   },
   "devDependencies": {
     "@sveltejs/vite-plugin-svelte": "^3.0.1",

diff --git a/integrations/vue-vite/index.html b/integrations/vue-vite/index.html
@@ -2,10 +2,10 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <title>Vite + Vue</title>
+    <title>Vite + Vue + TS</title>
   </head>
   <body>
     <div id="app"></div>
-    <script type="module" src="/src/main.js"></script>
+    <script type="module" src="/src/main.ts"></script>
   </body>
 </html>
diff --git a/integrations/vue-vite/package.json b/integrations/vue-vite/package.json
@@ -3,12 +3,17 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "test:bundle": "vite build"
+    "test:types": "vue-tsc",
+    "build": "vite build"
   },
   "dependencies": {
     "@tanstack/vue-query": "workspace:*",
+    "vue": "^3.3.0"
+  },
+  "devDependencies": {
     "@vitejs/plugin-vue": "^4.5.2",
+    "typescript": "5.2.2",
     "vite": "^5.0.10",
-    "vue": "^3.3.0"
+    "vue-tsc": "^1.8.26"
   }
 }
diff --git a/integrations/vue-vite/src/App.vue b/integrations/vue-vite/src/App.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script setup lang="ts">
 import { useQuery } from '@tanstack/vue-query'
 
 const { isPending, isError, data } = useQuery({

diff --git a/integrations/vue-vite/src/main.js → integrations/vue-vite/src/main.ts b/integrations/vue-vite/src/main.js → integrations/vue-vite/src/main.ts
diff --git a/integrations/vue-vite/src/vite-env.d.ts b/integrations/vue-vite/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/integrations/vue-vite/tsconfig.json b/integrations/vue-vite/tsconfig.json
@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "preserve",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}
diff --git a/integrations/vue-vite/tsconfig.node.json b/integrations/vue-vite/tsconfig.node.json
@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/integrations/vue-vite/vite.config.js → integrations/vue-vite/vite.config.ts b/integrations/vue-vite/vite.config.js → integrations/vue-vite/vite.config.ts
diff --git a/nx.json b/nx.json
@@ -53,11 +53,6 @@
       "inputs": ["default", "^public"],
       "cache": true
     },
-    "test:bundle": {
-      "dependsOn": ["^build"],
-      "inputs": ["default", "^public"],
-      "cache": true
-    },
     "build": {
       "dependsOn": ["^build"],
       "inputs": ["default", "^public"],

diff --git a/package.json b/package.json
@@ -12,17 +12,17 @@
     "preinstall": "node -e \"if(process.env.CI == 'true') {console.log('Skipping preinstall...'); process.exit(1)}\" || npx -y only-allow pnpm",
     "install:csb": "corepack enable && pnpm install --frozen-lockfile",
     "test": "pnpm run test:ci",
-    "test:ci": "nx run-many --exclude=examples/** --targets=test:format,test:sherif,test:eslint,test:lib,test:types,test:build,test:bundle,build",
-    "test:eslint": "nx affected --target=test:eslint",
+    "test:pr": "nx affected --targets=test:eslint,test:lib,test:types,test:build,build --exclude=examples/**",
+    "test:ci": "nx run-many --targets=test:format,test:sherif,test:eslint,test:lib,test:types,test:build,build --exclude=examples/**",
+    "test:eslint": "nx affected --target=test:eslint --exclude=examples/**",
     "test:format": "pnpm run prettier --check",
     "test:sherif": "sherif -i react-scripts -i typescript --ignore-package react-vite5 --ignore-package react-vite4",
-    "test:lib": "nx affected --target=test:lib",
-    "test:lib:dev": "pnpm --filter \"./packages/**\" run test:lib:dev",
-    "test:build": "nx affected --target=test:build",
-    "test:types": "nx affected --target=test:types",
-    "test:bundle": "nx affected --target=test:bundle",
-    "build": "nx affected --target=build",
-    "build:all": "nx run-many --exclude=examples/** --target=build",
+    "test:lib": "nx affected --target=test:lib --exclude=examples/**",
+    "test:lib:dev": "pnpm run test:lib && nx watch --all -- pnpm run test:lib",
+    "test:build": "nx affected --target=test:build --exclude=examples/**",
+    "test:types": "nx affected --target=test:types --exclude=examples/**",
+    "build": "nx affected --target=build --exclude=examples/**",
+    "build:all": "nx run-many --target=build --exclude=examples/**",
     "watch": "pnpm run build:all && nx watch --all -- pnpm run build:all",
     "dev": "pnpm run watch",
     "prettier": "prettier --ignore-unknown '**/*'",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml