Is there a way to minimize usage or properly tree-shake emojilib dependency?

[stefanobartoletti]

I'm in the process of optimizing a Nuxt website, and I noticed that there is a quite large part of the bundle that is made up of the emojilib package.

A quick analysis of my pnpm-lock.yaml is telling me that this dependency is loaded from

@nuxtjs/mdc>remark-emoji>node-emoji>emojilib

As you can see from the breakdown (this is the output of nuxi analyze), the emojis.json chunk is quite large, ~205/35gzip kb.

Is there a way to minimize its usage? I would say that not every project that needs Markdown also needs emojis, especially not the full library, especially since it has such relevant import cost.

Is there a way to properly tree-shake it, whitelist it, or any other way to reduce its size and avoid such heavy and mostly unused bundle? I also find it puzzling to see this running client-side.

Another possible solution would be to make remark-emoji an optional dependency, since, from what I see by reading its docs https://github.com/rhysd/remark-emoji, this package is used to transform emojis from this notation :rocket: to the proper emoji 🚀 (which is not handled by this library, but by an emoji font).

So in cases where the content editor directly uses emojis and not the :: notation, the whole package is basically not even used.

Thanks for this great module anyway, this is just a minor but useful optimization 💚

[itpropro]

Any updates @farnabaz ?
I also had multiple problems with the emojilib dependency, especially when you don't use shamefully hoisting with pnpm.

[farnabaz]

Thanks for the issue and pinging
This should be fixed in edge channel (@nuxtjs/[email protected]) simply by disabling remark-emoji in Nuxt Config

export default defineNuxtConfig({
  mdc: {
    remarkPlugins: {
      'remark-emoji': false
    }
  }
})

[farnabaz]

@adamdehaven There will be a breaking change in the next version for using the module outside of Nuxt.

remark-emoji will not be registered by default in Vue applications

[adamdehaven]

@adamdehaven There will be a breaking change in the next version for using the module outside of Nuxt.

remark-emoji will not be registered by default in Vue applications

As long as it’s documented 👍

Could the remark-emoji package here be moved to devDependencies and peerDependencies in package.json? This would tell downstream package managers to install the package on their own.