feat(tooling): use vite-config tooling pkg

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

docs/package.json

@@ -14,8 +14,8 @@
     "@algolia/client-search": "^4.14.3",
     "@animxyz/core": "^0.6.6",
     "@animxyz/vue3": "^0.6.7",
-    "@stackblitz/sdk": "^1.8.0",
+    "@stackblitz/sdk": "^1.8.2",
-    "@vercel/analytics": "^0.1.8",
+    "@vercel/analytics": "^0.1.10",
     "@vue-flow/background": "workspace:*",
     "@vue-flow/controls": "workspace:*",
     "@vue-flow/core": "workspace:*",
@@ -23,27 +23,27 @@
     "@vue-flow/node-resizer": "workspace:*",
     "@vue-flow/node-toolbar": "workspace:*",
     "@vue/repl": "1.3.2",
-    "blobity": "^0.2.1",
+    "blobity": "^0.2.3",
     "canvas-confetti": "^1.6.0",
-    "vite": "^2.9.15",
     "vue": "^3.2.37",
     "web-vitals": "^3.1.1"
   },
   "devDependencies": {
     "@iconify/json": "^2.1.95",
-    "@types/canvas-confetti": "^1.4.3",
+    "@types/canvas-confetti": "^1.6.0",
-    "@types/node": "^18.11.18",
+    "@types/node": "^18.14.0",
     "@vue-flow/eslint-config": "workspace:*",
     "@windicss/plugin-scrollbar": "^1.2.3",
     "dotenv": "^16.0.3",
     "ohmyfetch": "^0.4.21",
-    "typedoc": "^0.23.24",
+    "typedoc": "^0.23.25",
     "typedoc-plugin-markdown": "^3.14.0",
     "typedoc-plugin-merge-modules": "^4.0.1",
-    "unplugin-auto-import": "^0.11.4",
+    "unplugin-auto-import": "^0.14.4",
     "unplugin-icons": "^0.14.13",
     "unplugin-vue-components": "^0.22.9",
     "vite-plugin-windicss": "^1.8.10",
+    "vite": "^2.9.15",
     "vitepress": "1.0.0-alpha.4",
     "windicss": "^3.5.6"
   }

docs/src/auto-imports.d.ts

@@ -101,6 +101,7 @@ declare global {
   const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
   const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
   const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayFindLast: typeof import('@vueuse/core')['useArrayFindLast']
   const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
   const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
   const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
@@ -195,6 +196,7 @@ declare global {
   const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
   const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
   const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
+  const usePrevious: typeof import('@vueuse/core')['usePrevious']
   const useRafFn: typeof import('@vueuse/core')['useRafFn']
   const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
   const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']

examples/vite/package.json

@@ -21,7 +21,7 @@
     "@vitejs/plugin-vue": "^4.0.0",
     "dagre": "^0.8.5",
     "unplugin-auto-import": "^0.14.4",
-    "vite": "^4.1.3",
+    "vite": "^4.1.4",
     "vite-svg-loader": "^3.6.0",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6"

packages/background/package.json

@@ -31,7 +31,6 @@
   "peerDependencies": {
     "@vue-flow/core": "^1.12.2"
   },
-  "dependencies": {},
   "devDependencies": {
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",

packages/controls/package.json

@@ -29,19 +29,15 @@
     "test": "exit 0"
   },
   "peerDependencies": {
-    "@vue-flow/core": "^1.12.2",
+    "@vue-flow/core": "^1.12.2"
-    "vue": "^3.2.37"
   },
-  "dependencies": {},
   "devDependencies": {
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue-flow/vite-config": "workspace:*",
-    "unplugin-auto-import": "^0.14.4",
+    "vite": "^4.1.4",
-    "vite": "^4.1.3",
+    "vite-svg-loader": "^4.0.0",
-    "vite-plugin-vue-type-imports": "^0.2.4",
-    "vite-svg-loader": "^3.6.0",
     "vue-tsc": "^1.1.5"
   },
   "publishConfig": {

packages/controls/tsconfig.json

@@ -9,6 +9,6 @@
     ]
   },
   "include": [
-    "./src"
+    "./src",
   ]
 }

packages/controls/vite.config.ts

@@ -1,47 +1,15 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
-import vue from '@vitejs/plugin-vue'
-import AutoImport from 'unplugin-auto-import/vite'
-import vueTypes from 'vite-plugin-vue-type-imports'
 import svgLoader from 'vite-svg-loader'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    extensions: ['.ts', '.vue'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow-controls',
       name: 'vueFlowControls',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue', '@vue-flow/core'],
-      output: {
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          'vue': 'Vue',
-          '@vue-flow/core': 'VueFlow',
-        },
-      },
-    },
   },
-  plugins: [
+  plugins: [svgLoader() as any],
-    vue({
-      reactivityTransform: true,
-    }),
-    vueTypes(),
-    AutoImport({
-      imports: ['vue', 'vue/macros'],
-      dts: 'src/auto-imports.d.ts',
-    }),
-    svgLoader(),
-  ],
 })

packages/core/package.json

@@ -49,16 +49,14 @@
     "@types/d3": "^7.4.0",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue-flow/vite-config": "workspace:*",
     "autoprefixer": "^10.4.13",
     "postcss": "^8.4.21",
     "postcss-cli": "^10.1.0",
     "postcss-nested": "^6.0.1",
     "ts-patch": "^2.1.0",
     "typescript-transform-paths": "^3.4.6",
-    "unplugin-auto-import": "^0.14.4",
+    "vite": "^4.1.4",
-    "unplugin-vue-macros": "^1.8.2",
-    "vite": "^4.1.3",
     "vue-tsc": "^1.1.5"
   },
   "publishConfig": {

packages/core/src/auto-imports.d.ts

@@ -1,7 +1,4 @@
-/* eslint-disable */
+// Generated by 'unplugin-auto-import'
-/* prettier-ignore */
-// @ts-nocheck
-// Generated by unplugin-auto-import
 export {}
 declare global {
   const $$: typeof import('vue/macros')['$$']
@@ -168,6 +165,7 @@ declare global {
   const rendererPointToPoint: typeof import('./utils/graph')['rendererPointToPoint']
   const resetRecentHandle: typeof import('./utils/handle')['resetRecentHandle']
   const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveDirective: typeof import('vue')['resolveDirective']
   const resolveRef: typeof import('@vueuse/core')['resolveRef']
   const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
   const shallowReactive: typeof import('vue')['shallowReactive']
@@ -378,8 +376,3 @@ declare global {
   const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
   const whenever: typeof import('@vueuse/core')['whenever']
 }
-// for type re-export
-declare global {
-  // @ts-ignore
-  export type { Component,ComponentPublicInstance,ComputedRef,InjectionKey,PropType,Ref,VNode } from 'vue'
-}

packages/core/tsconfig.json

@@ -24,5 +24,10 @@
   },
   "include": [
     "./src"
+  ],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
   ]
 }

packages/core/tsconfig.node.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"],
+  "files": ["package.json"]
+}

packages/core/vite.config.ts

@@ -6,7 +6,6 @@ import AutoImport from 'unplugin-auto-import/vite'
 import replace from '@rollup/plugin-replace'
 import pkg from './package.json'
 
-// https://vitejs.dev/config/
 export default defineConfig({
   resolve: {
     alias: {

packages/minimap/package.json

@@ -29,8 +29,7 @@
     "test": "exit 0"
   },
   "peerDependencies": {
-    "@vue-flow/core": "^1.12.2",
+    "@vue-flow/core": "^1.12.2"
-    "vue": "^3.2.37"
   },
   "dependencies": {
     "d3-selection": "^3.0.0",
@@ -42,10 +41,8 @@
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue-flow/vite-config": "workspace:*",
-    "unplugin-auto-import": "^0.14.4",
+    "vite": "^4.1.4",
-    "vite": "^4.1.3",
-    "vite-plugin-vue-type-imports": "^0.2.4",
     "vue-tsc": "^1.1.5"
   },
   "publishConfig": {

packages/minimap/vite.config.ts

@@ -1,45 +1,13 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
-import vue from '@vitejs/plugin-vue'
-import AutoImport from 'unplugin-auto-import/vite'
-import vueTypes from 'vite-plugin-vue-type-imports'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    extensions: ['.ts', '.vue'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow-minimap',
       name: 'vueFlowMiniMap',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue', '@vue-flow/core'],
-      output: {
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          'vue': 'Vue',
-          '@vue-flow/core': 'VueFlow',
-        },
-      },
-    },
   },
-  plugins: [
-    vue({
-      reactivityTransform: true,
-    }),
-    vueTypes(),
-    AutoImport({
-      imports: ['vue', 'vue/macros'],
-      dts: 'src/auto-imports.d.ts',
-    }),
-  ],
 })

packages/node-resizer/package.json

@@ -42,10 +42,9 @@
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue-flow/vite-config": "workspace:*",
-    "unplugin-auto-import": "^0.14.4",
-    "vite": "^4.1.3",
     "vite-plugin-vue-type-imports": "^0.2.4",
+    "vite": "^4.1.4",
     "vue-tsc": "^1.1.5"
   },
   "publishConfig": {

packages/node-resizer/vite.config.ts

@@ -1,45 +1,15 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
-import vue from '@vitejs/plugin-vue'
-import AutoImport from 'unplugin-auto-import/vite'
 import vueTypes from 'vite-plugin-vue-type-imports'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    extensions: ['.ts', '.vue'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow-node-resizer',
       name: 'vueFlowNodeResizer',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue', '@vue-flow/core'],
-      output: {
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          'vue': 'Vue',
-          '@vue-flow/core': 'VueFlow',
-        },
-      },
-    },
   },
-  plugins: [
+  plugins: [vueTypes() as any],
-    vue({
-      reactivityTransform: true,
-    }),
-    vueTypes(),
-    AutoImport({
-      imports: ['vue', 'vue/macros'],
-      dts: 'src/auto-imports.d.ts',
-    }),
-  ],
 })

packages/node-toolbar/package.json

@@ -29,18 +29,14 @@
     "test": "exit 0"
   },
   "peerDependencies": {
-    "@vue-flow/core": "^1.12.2",
+    "@vue-flow/core": "^1.12.2"
-    "vue": "^3.2.37"
   },
-  "dependencies": {},
   "devDependencies": {
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vue-flow/vite-config": "workspace:*",
-    "unplugin-auto-import": "^0.14.4",
+    "vite": "^4.1.4",
-    "vite": "^4.1.3",
-    "vite-plugin-vue-type-imports": "^0.2.4",
     "vue-tsc": "^1.1.5"
   },
   "publishConfig": {

packages/node-toolbar/vite.config.ts

@@ -1,45 +1,13 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
-import vue from '@vitejs/plugin-vue'
-import AutoImport from 'unplugin-auto-import/vite'
-import vueTypes from 'vite-plugin-vue-type-imports'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    extensions: ['.ts', '.vue'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow-node-toolbar',
       name: 'vueFlowNodeToolbar',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue', '@vue-flow/core'],
-      output: {
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          'vue': 'Vue',
-          '@vue-flow/core': 'VueFlow',
-        },
-      },
-    },
   },
-  plugins: [
-    vue({
-      reactivityTransform: true,
-    }),
-    vueTypes(),
-    AutoImport({
-      imports: ['vue', 'vue/macros'],
-      dts: 'src/auto-imports.d.ts',
-    }),
-  ],
 })

packages/pathfinding-edge/package.json

@@ -26,27 +26,25 @@
     "test": "exit 0;",
     "lint": "eslint --ext \".js,.jsx,.ts,.tsx\" --fix ."
   },
+  "peerDependencies": {
+    "@vue-flow/core": "^1.12.2"
+  },
   "dependencies": {
     "pathfinding": "^0.4.18",
     "perfect-arrows": "^0.3.7"
   },
   "devDependencies": {
+    "@types/pathfinding": "^0.0.6",
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
-    "@types/pathfinding": "^0.0.6",
+    "@vue-flow/vite-config": "workspace:*",
     "@vitejs/plugin-vue": "^4.0.0",
     "ts-patch": "^2.1.0",
     "typescript-transform-paths": "^3.4.6",
-    "unplugin-auto-import": "^0.14.4",
+    "vite": "^4.1.4",
-    "vite": "^4.1.3",
-    "vite-plugin-vue-type-imports": "^0.2.4",
     "vue-tsc": "^1.1.5"
   },
-  "peerDependencies": {
-    "@vue-flow/core": "^1.12.2",
-    "vue": "^3.2.25"
-  },
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"

packages/pathfinding-edge/src/auto-imports.d.ts

@@ -4,6 +4,13 @@
 // Generated by unplugin-auto-import
 export {}
 declare global {
+  const $$: typeof import('vue/macros')['$$']
+  const $: typeof import('vue/macros')['$']
+  const $computed: typeof import('vue/macros')['$computed']
+  const $customRef: typeof import('vue/macros')['$customRef']
+  const $ref: typeof import('vue/macros')['$ref']
+  const $shallowRef: typeof import('vue/macros')['$shallowRef']
+  const $toRef: typeof import('vue/macros')['$toRef']
   const EffectScope: typeof import('vue')['EffectScope']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']

packages/pathfinding-edge/vite.config.ts

@@ -1,47 +1,13 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
-import vue from '@vitejs/plugin-vue'
-import vueTypes from 'vite-plugin-vue-type-imports'
-import AutoImport from 'unplugin-auto-import/vite'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    alias: {
-      '~': resolve('src'),
-    },
-    dedupe: ['vue'],
-    extensions: ['.ts', '.vue'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow-pathfinding-edge',
       name: 'vueFlowPathfindingEdge',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue', '@vue-flow/core'],
-      output: {
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          'vue': 'Vue',
-          '@vue-flow/core': 'VueFlow',
-        },
-      },
-    },
   },
-  plugins: [
-    vue(),
-    vueTypes(),
-    AutoImport({
-      imports: ['vue'],
-      dts: 'src/auto-imports.d.ts',
-    }),
-  ],
 })

packages/vue-flow/package.json

@@ -38,6 +38,7 @@
     "@vue-flow/core": "workspace:*",
     "@vue-flow/eslint-config": "workspace:*",
     "@vue-flow/tsconfig": "workspace:*",
+    "@vue-flow/vite-config": "workspace:*",
     "@vue-flow/minimap": "workspace:*"
   },
   "devDependencies": {
@@ -45,7 +46,7 @@
     "postcss": "^8.4.21",
     "postcss-cli": "^10.1.0",
     "postcss-nested": "^6.0.1",
-    "vite": "^4.1.3"
+    "vite": "^4.1.4"
   },
   "publishConfig": {
     "access": "public",

packages/vue-flow/vite.config.ts

@@ -1,35 +1,13 @@
 import { resolve } from 'path'
-import { defineConfig } from 'vite'
+import { withConfig } from '@vue-flow/vite-config'
 
-// https://vitejs.dev/config/
+export default withConfig({
-export default defineConfig({
-  resolve: {
-    alias: {
-      '~': resolve('src'),
-    },
-    extensions: ['.ts'],
-  },
   build: {
-    emptyOutDir: false,
     lib: {
       formats: ['es', 'cjs', 'iife'],
       entry: resolve(__dirname, 'src/index.ts'),
       fileName: 'vue-flow',
       name: 'vueFlow',
     },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: ['vue'],
-      output: {
-        format: 'esm',
-        dir: './dist',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          vue: 'Vue',
-        },
-      },
-    },
   },
 })

tooling/vite-config/.eslintrc.js

@@ -1,3 +1,4 @@
 module.exports = {
   extends: ['@vue-flow/eslint-config'],
+  ignorePatterns: '!**/*',
 }

tooling/vite-config/package.json

@@ -11,7 +11,7 @@
     "@vitejs/plugin-vue": "^4.0.0",
     "defu": "^6.1.2",
     "unplugin-auto-import": "^0.14.4",
-    "vite-plugin-vue-type-imports": "^0.2.4",
+    "unplugin-vue-macros": "^1.8.2",
     "vite": "^4.1.4"
   }
 }

tooling/vite-config/src/index.d.ts

@@ -1,3 +1,3 @@
-import type { UserConfig } from 'vite';
+import type { UserConfig } from 'vite'
 
-export declare function withConfig(viteConfig: UserConfig): UserConfig;
+export declare function withConfig(viteConfig: UserConfig): UserConfig