feat: upgrade to vite 3

fix: build hanging

fix: sandbox font size

examples/vue2/package.json

@@ -14,7 +14,7 @@
  "@histoire/plugin-vue2": "workspace:*",
  "@vitejs/plugin-vue2": "^1.1.2",
  "histoire": "workspace:*",
- "vite": "^2.9.1",
+ "vite": "^3.0.5",
  "vue-template-compiler": "^2.7.8"
  }
 }

examples/vue3-percy/package.json

@@ -13,8 +13,8 @@
  "devDependencies": {
  "@histoire/plugin-percy": "workspace:*",
  "@histoire/plugin-vue": "workspace:*",
- "@vitejs/plugin-vue": "^2.3.1",
+ "@vitejs/plugin-vue": "^3.0.1",
  "histoire": "workspace:*",
- "vite": "^2.9.1"
+ "vite": "^3.0.5"
  }
 }

examples/vue3-screenshot/package.json

@@ -13,8 +13,8 @@
  "devDependencies": {
  "@histoire/plugin-screenshot": "workspace:*",
  "@histoire/plugin-vue": "workspace:*",
- "@vitejs/plugin-vue": "^2.3.1",
+ "@vitejs/plugin-vue": "^3.0.1",
  "histoire": "workspace:*",
- "vite": "^2.9.1"
+ "vite": "^3.0.5"
  }
 }

examples/vue3-themed/package.json

@@ -11,9 +11,9 @@
  "vue": "^3.2.31"
  },
  "devDependencies": {
- "@vitejs/plugin-vue": "^2.3.1",
+ "@vitejs/plugin-vue": "^3.0.1",
  "@histoire/plugin-vue": "workspace:*",
  "histoire": "workspace:*",
- "vite": "^2.9.1"
+ "vite": "^3.0.5"
  }
 }

examples/vue3/package.json

@@ -17,12 +17,12 @@
  "vue-i18n": "^9.1.10"
  },
  "devDependencies": {
- "@vitejs/plugin-vue": "^2.3.1",
+ "@vitejs/plugin-vue": "^3.0.1",
  "@histoire/plugin-vue": "workspace:*",
  "cypress": "^9.5.3",
  "histoire": "workspace:*",
  "sass": "^1.50.0",
  "start-server-and-test": "^1.14.0",
- "vite": "^2.9.1"
+ "vite": "^3.0.5"
  }
 }

examples/vue3/src/main.ts

@@ -0,0 +1,5 @@
+import { createApp } from 'vue'
+import Responsive from './components/Responsive.vue'
+
+const app = createApp(Responsive)
+app.mount('#app')

examples/vue3/src/shim.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+ import { ComponentOptions } from 'vue'
+ const comp: ComponentOptions
+ export default comp
+}

examples/vue3/vite.config.ts

@@ -8,7 +8,7 @@ export default defineConfig({
  // Example build config for a component library
  build: {
  lib: {
- entry: path.resolve(__dirname, './src/main.js'),
+ entry: path.resolve(__dirname, './src/main.ts'),
  name: 'histoire-kit',
  fileName: (format) => `histoire-kit.${format}.js`,
  },

package.json

@@ -61,6 +61,7 @@
  "eslint": "*",
  "eslint-plugin-promise": "*",
  "eslint-plugin-vue": "*",
+ "vite": "^2.9.0 || ^3.0.0",
  "vue": "*"
  }
  }

packages/histoire-app/src/app/style/sandbox.css

@@ -10,7 +10,7 @@ body {
 }
 
 html {
- font-size: .875rem;
+ font-size: 1rem;
  font-family: 'Lato', sans-serif;
 }
 

packages/histoire-plugin-nuxt/src/index.ts

@@ -16,6 +16,7 @@ export function HstNuxt (): Plugin {
  return {
  name: '@histoire/plugin-nuxt',
 
+ // @ts-expect-error Different versions of Vite in devDependencies @TODO update when Nuxt switches to Vite 3
  async config () {
  const nuxtConfig = await useNuxtViteConfig()
  nuxt = nuxtConfig.nuxt

packages/histoire/package.json

@@ -63,10 +63,10 @@
  "shiki": "0.10.1",
  "sirv": "^2.0.2",
  "tinypool": "^0.1.2",
- "vite-node": "0.12.1"
+ "vite-node": "0.21.1"
  },
  "peerDependencies": {
- "vite": "^2.9.0"
+ "vite": "^2.9.0 || ^3.0.0"
  },
  "devDependencies": {
  "@peeky/test": "^0.13.5",
@@ -76,6 +76,6 @@
  "@types/node": "^17.0.32",
  "rollup": "^2.59.0",
  "typescript": "^4.7.4",
- "vite": "^2.9.1"
+ "vite": "^3.0.5"
  }
 }

packages/histoire/src/node/config.ts

@@ -289,7 +289,8 @@ export function getDefaultConfig (): HistoireConfig {
  const index = config.plugins?.findIndex(plugin => Array.isArray(plugin) &&
  typeof plugin[0] === 'object' &&
  !Array.isArray(plugin[0]) &&
- plugin[0].name.startsWith('vite:legacy'))
+ // @ts-expect-error could have no property 'name'
+ plugin[0].name?.startsWith('vite:legacy'))
  if (index !== -1) {
  config.plugins?.splice(index, 1)
  }

packages/histoire/src/node/vite.ts

@@ -98,7 +98,6 @@ export async function getViteConfigWithPlugins (isServer: boolean, ctx: Context)
  },
  },
  optimizeDeps: {
- disabled: isServer,
  entries: [
  `${APP_PATH}/bundle-main.js`,
  `${APP_PATH}/bundle-sandbox.js`,