Nuxt.js returns undefined for custom plugin

Viewed 523

I wanted to create a custom plugin for a local databaase in Nuxt.js, after I was done with the code I registered it in nuxt.config.js and it didn't work. So I've tried the example code on docs to see what I was doing wrong, and the thing is, example code didn't work too. Here is how I registered it:

plugins/hello.js

export default ({ app }, inject) => {
  inject("hello", msg => console.log(`Hello ${msg}!`));
};

nuxt.config.js

module.exports = {
  ssr: false,
  target: "static",
  head: {
    title: "project-title",
    meta: [{ charset: "utf-8" }],
  },
  loading: false,
  plugins: [{ ssr: true, src: "@/plugins/icons.js" }, "@/plugins/hello.js"],
  modules: ["@nuxtjs/axios", "@nuxtjs/auth-next"],
}

Whenever I try to use this.$hello("something"), Nuxt returns this.$hello is not a function

1 Answers

Hmm, got it. After deleting and reinstalling node_modules it's resolved, then I tried changing the name of the plugin file, after then build failed from ./node_modules/@nuxt/webpack/node_modules/babel-loader/lib/index.js. After reinstalling packages again (deleted .nuxt, node_modules and lock file) issue is resolved.

Related