@kr_ilya

Как загружать только нужные стили?

Не знаю, какие теги выбрать, если что модеры поправьте ))

Делаю ssr приложение на nuxt.js (vue.js) и столкнулся с такой проблемой, что в исходный код страницы попадают абсолютно все стили (не учитываю тех, что в компонентах). Это всякие vuetify, mdi-icons и другие. Всего получается 22к строк, что не есть хорошо.
Можно ли как то не загружать весь файл стилей, а только нужные. (не нужны же мне все иконки, а только пару штук). Есть ли плагины, которые так делают? Или в конфиге webpack или nuxt.js нужно что-то прописать? Как решить проблему?
  • Вопрос задан
  • 784 просмотра
Пригласить эксперта
Ответы на вопрос 1
Fragster
@Fragster
помогло? отметь решением!
Для js нужно использовать возможности tree shaking от вебпака, читать тут: https://vuetifyjs.com/en/framework/a-la-carte и в других подобных разделах по используемым либам.
Для css вырезать лишние стили можно с помощью https://www.purgecss.com/ но там тоже есть нюансы, например https://medium.com/@kyis/vue-tailwind-purgecss-the... для tailwind + vue, в общем, нужно тестить и проверять экстракторы
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы