Building with Vite's JavaScript API

on YouTube ↗07m

" summary

A tool called Preview.js uses the Vite JavaScript API and a thin wrapper around Vite's dev server to render any UI component (React, Preact, Solid, Svelte, Vue2/3) inside an IDE panel. It detects components and extracts prop types with the TypeScript compiler API, generates safe fake props, and serves updated in‑memory modules through a virtual file plugin so edits propagate on every keystroke in a few milliseconds — the preview works live.

AI-written summary · about

" related talks

• 18mPreview.js: How Vite enables instant component previews in your IDEFrançois Wouts · ViteConf 2022
• 20mVite - The Next Generation Frontend ToolingDevlin Duldulao · React Advanced 2021
• 47mVite, a New Era of Frontend Tooling?Christophe Jollivet, Yann-Thomas Le Moigne · DevFest Lille 2023
• 26mVue & Vite DevtoolsGuillaume Chau · Vuejs Amsterdam 2024
• 15mNew Ways to VueAnthony Fu · Vue.js London Live 2021
• 18mIntroduction to Vite & VitepressTim Benniks · Vue.js Global 2020
• 15mVite: The next generation frontend toolingDevlin Duldulao · React Alicante 2022
• 38mHow vite changes the game for Vue and Web developmentAlex Kyriakidis · JSWorld Conference 2022