BLACK FRIDAY - Get 35% off your Mastering Nuxt license!

Custom Plugins

In this example:

plugins/hello.js - logs a message to the console with a dynamic message.

store/index.js - stores our dynamic message from our input.

pages/index.vue uses the hello plugin to:

  • log a message to the console on mounted.
  • log a message to the console containing the value from our input.

plugins/nuxt-api.js - fetches data from our API.

pages/api-plugin.vue - uses our plugin to fetch and show the data from our API.

nuxt.config.js - registers our plugins using the plugins property.

Learn more in the Directory Structure book in the plugins chapter.

Loading CodeSandbox...