Avoid redundant Component imports in Nuxt

The idea is to create a plugin to register some reusable components that will be used repeatedly

Okay, so in this post I will share how I solve my problem about redundant import Component in Nuxt.

Here we go…

I have a component named “PrimaryButton”, it will be use in some pages. In each pages, I have to import it and register it on the page component.

The codes in above is an example of page component that use PrimaryButton component, which is we have to import and register it on our component. If we have more than one component, we will doit repeatedly right?

So, my idea is to create a plugin in Nuxt to solve the problem. src/plugins/global-components.js

then, register it on the nuxt.config.js

After that, I can use the global components directly on the all of the component/page-component in the project without import statement.

Thanks ❤️