Module improvements

[pi0]

Hi! Following up nuxt/modules#427 i've made a quick review:

• Current compatibility will be broken with latest RC 9+ versions. Please see fix(kit)!: handle prerelease constraint nuxt/framework#7116
• Plugin is client only, i would suggest to rename it to plugin.client and also add a plugin.server that mocks $umami to avoid breaking users on SSR

Rest seems a nice module 🚀

[ijkml]

Hi, thanks for the review. I'll get to work on it, immediately.

Please, to clarify, how do you mean mock? Mock (as in fake) the umami function on the server?

Thank you.

[pi0]

An empty function should do the trick. It is to avoid breaking SSR code if someone calls $umami wrongly.

[ijkml]

Thank you.

Nearly there... Created the mock, and renamed the plugin to plugin.client. But now I run into an issue, the module fails to resolve the plugin, unless I change it to 'plugin.client' (which defeats the whole purpose, I'll admit).

Here's the addPlugin function:

nuxt-umami/src/module.ts

Line 66 in 012b8cb

addPlugin({ src: resolve(runtimeDir, 'plugin.client'), mode: 'client' });

And the error:

[ijkml]

Hi @pi0
It seems file name modifiers are not working as expected when using nuxt/kit.

So, what I did was:

• provide the mock as default
• load script (returns Promise<false> if window is undefined else Promise<HTMLScriptElement>)
  • if false or error, do nothing (ssr)
  • else replace mock with umami

That way umami is mocked if used by mistake, and a warning is logged.

Please let me know what you think, and what other improvements I can make.

https://github.com/ijkml/nuxt-umami/tree/client-only-patch

[pi0]

Hi dear @ijkml. I have checked client-only patch! It is in fact a much nicer solution to use one plugin with ssr fallback. Only as a tip, instead of using process.env.NODE_ENV !== 'production';, use if (process.client) (inside) the implementation. This way you can hint rollup to treeshake client code from server bundle. call to load-script for example can be done like this.

[ijkml]

Thank you, @pi0 for your time and patience 🙏

Please have one more look: #5