Quasar & Vue 3: Create an Icon Library (Reduce Bundle Size by 50% - 70%!)

Опубликовано: 28 Июль 2021
на канале: Make Apps with Danny
5,738
142

In this video, I’m gonna show how to reduce your Quasar app’s bundle size by 50 - 70% by creating a Custom Icon Library with only the icons you need for your project

In this series I'm documenting my journey creating a real world app from scratch, using Quasar 2, Vue 3 & Composition API. An app that will ultimately be deployed to the iOS, Android, Mac & Windows App Stores.

👉 Source Code: https://dannys.link/quasariconlibrary...
👉 Full playlist:    • Creating a Real World Quasar App (Vue 3)  

0:00 Introduction
0:28 What We’re Gonna Do
2:18 Getting Started
4:58 Install Icon Libraries & Add Icons
9:41 Build & Check Initial Bundle Size
11:23 Grab the SVG’s
14:54 Generate Icon Library with Fantasticon
18:11 Add New Icons to the Page
20:17 Optimise Icon Generation
23:13 Create NPM Script
24:11 Organise SVG’s with Folders
26:58 Watch for Changes
30:29 Custom Icons!
32:35 Remove Big Ass Icon Libraries
33:18 Caveat: Some Quasar Components use Material Icons!
36:44 Build & See New Bundle Size

👉 My Courses - https://dannys.link/courses
👉 Download Fudget: https://www.fudget.com
👉 My VSCode Setup - https://dannys.link/vscodesetup
👉 DONT CLICK THIS - https://dannys.link/dontclick


Смотрите видео Quasar & Vue 3: Create an Icon Library (Reduce Bundle Size by 50% - 70%!) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Make Apps with Danny 28 Июль 2021, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 5,738 раз и оно понравилось 142 людям.