Build a JavaScript Project using Vite: Next Generation FrontEnd Tooling - Tutorial
Web developers use build tools to help them care of processing and bundling code. Vite is an opinionated platform that helps you build your projects quicker. Let's build a simple project to see what it can do for you and how things work.
Index
=====
00:00 Intro
00:17 Installing
00:58 installation Results
01:20 Entry Point
01:53 Loading CSS
02:07 CSS in JS?
02:37 Customizing Vite
02:54 Adding Files
03:16 Reading Markdown
03:44 Files as Raw Data
04:02 Hot Module Reloading
06:20 CSS Imports
URLs
=====
Vite Website: https://vitejs.dev
Finished Code: https://go.raybo.org/5_fJ
A lot of modern web development requires a build process for handling processing modules from Javascript, react, sass or supporting new features and there's a lot of tools for doing this, so, so what's the difference?
Vite is opinionated, so you give up a bit of control, but it gets you going quicker. I'm going to scaffold a new project with Vite.
By the way, you want to make sure that you have NodeJS 12 or greater to get it to work. Iit scaffolds the project for you, places it where you specify and it shows you the commands you need to run this project.
Vite uses an index.html file as the entry point of our application. It resolves references to scripts, even inline scripts with a type of module as well as css as code. There's no need for special placeholders and it also supports multiple html pages as entry points.
Vite also gives you a lot of advanced CSS features. For example, you can use PostCSS, import statements, it takes care of prefixing things if necessary and rebases all links inside the CSS for you. You can even use CSS modules and treat your CSS like a javascript object. It has built-in support for Sass, less and stylus.
Vite uses something called HRM. Hot Module Reloading means that…to speed up development, modules are updated individually without having to reload other modules. That makes Vite extremely fast.
Смотрите видео Build a JavaScript Project using Vite: Next Generation FrontEnd Tooling - Tutorial онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Ray Villalobos 20 Октябрь 2021, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 8,30 раз и оно понравилось 14 людям.