S04 L03 Introducing Vite (Dev Server, Build, Preview)

📘 INTRODUCING VITE — DEV SERVER, BUILD, PREVIEW In this lesson, we introduce Vite and use it to solve browser module import issues from the previous lesson. You will install Vite, run the development server, configure npm scripts, and generate a production-ready build output. 🎯 IN THIS VIDEO Install Vite as a development dependency Understand what gets added to package.json and node_modules Run Vite directly and open the local dev URL See live reload behavior when source files change Configure npm scripts for standard development workflow Run the app with npm run dev Build production assets with npm run build Preview production build output locally with npm run preview 🚀 HOW TO USE THIS COURSE Vite is the core toolchain for the next stages of the course. Once this workflow is in place, adding packages, building features, and deploying production artifacts becomes much smoother and more reliable. 👉 Course Website: www.richardbraycourses.co.uk 👉 Course Repositories: www.github.com/RichardBrayCourses 👉 Full course playlist: https://youtube.com/playlist?list=PLNlOxdq7xu14b5ewH4IJC9tMinkgZBuVR&si=Pg8pEDR5UUbQstz6 📂 SECTION REPOSITORY Section 4 repository: https://github.com/RichardBrayCourses/frontend04-vite-npm 💡 NOTE The dist folder is the deployable output generated by Vite for production hosting.