Offline usage in Nuxt 2 slows down the dev page loading times

nuxt: 2.15.8 node: v16.14.2

I’m working on it with Nuxt SSR. I created a plugin

//plugins/iconify.js
import Vue from 'vue';
import { Icon } from "@iconify/vue2";
import { addIcon } from "@iconify/vue2/offline";

import mdiYoutubeTv from "@iconify/icons-mdi/youtube-tv";
addIcon('mdi:youtube-tv', mdiYoutubeTv);

Vue.component('Icon', Icon);

run yarn dev

After that it seems The loading of the web page is extremely slow. It takes about 1-3+ seconds from 50-200ms. If importing a lot It will take more time. This only happens when dev only production is very fast.

before

after

[cyberalien]

If you want to use only offline mode, maybe unplugin-icons would solve issue? See https://github.com/antfu/unplugin-icons

It generates components dynamically for each icon, no extra overhead. Iconify components are meant to be used with API, but unplugin-icons is meant to be used with bundlers.

[cyberalien]

Excellent.

unplugin-icons is a much better solution for offline use.