Nuxt.js: Module - use this.nuxt.plugin give error (how use new hook system correct)

Created on 14 Jan 2018  路  4Comments  路  Source: nuxt/nuxt.js

I wan't to use module for WP API request in whole app and to easily copy on other projects.
Right now I get:

(node:7476) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): TypeError: this.nuxt.plugin is not a function

Content of module file:

const { resolve } = require('path');
const defaults = {};

module.exports = async function wp (moduleOptions) {
  let options = Object.assign({}, defaults, this.options['wp'], moduleOptions);

  // this.addPlugin({
  //   src: resolve(__dirname, './templates/wp.plugin.js'),
  //   fileName: 'wp.plugin.js',
  //   options
  // });

    this.nuxt.plugin('generate', async generator => {
      console.log(generator);
      // This will be called when a Nuxt generate starts
    }).then(function () {
        console.log("Promise Resolved");
    }).catch(function () {
        console.log("Promise Rejected");
    });
};

module.exports.meta = require('../package.json');

Documentation: https://nuxtjs.org/guide/modules/#run-tasks-on-specific-hooks
Where is error? No good example for use this.next

Found:
We have a new internal hook system now, some modules can be broken with 1.0 if they were relying on this.nuxt.plugin(), instead, they will have to use this.hook(), see module hooks documentation.

This isn't show on documentation. Can somebody link where hook is show and work correct in last release?

This question is available on Nuxt.js community (#c2251)

Most helpful comment

The link in the release notes is broken, I had the same problem.

The answer is to replace this.nuxt.plugin with this.nuxt.hook. You'll have to look at the source code for the correct hook names (see https://github.com/nuxt/nuxt.js/blob/dev/lib/builder/generator.js for your case - callHook methods), until the link is fixed or the documentation is updated.

This should work:

const { resolve } = require('path');
const defaults = {};

module.exports = async function wp (moduleOptions) {
  let options = Object.assign({}, defaults, this.options['wp'], moduleOptions);

  // this.addPlugin({
  //   src: resolve(__dirname, './templates/wp.plugin.js'),
  //   fileName: 'wp.plugin.js',
  //   options
  // });

    this.nuxt.hook('generate:before', async generator => {
      console.log(generator);
      // This will be called when a Nuxt generate starts
    }).then(function () {
        console.log("Promise Resolved");
    }).catch(function () {
        console.log("Promise Rejected");
    });
};

module.exports.meta = require('../package.json');

All 4 comments

The link in the release notes is broken, I had the same problem.

The answer is to replace this.nuxt.plugin with this.nuxt.hook. You'll have to look at the source code for the correct hook names (see https://github.com/nuxt/nuxt.js/blob/dev/lib/builder/generator.js for your case - callHook methods), until the link is fixed or the documentation is updated.

This should work:

const { resolve } = require('path');
const defaults = {};

module.exports = async function wp (moduleOptions) {
  let options = Object.assign({}, defaults, this.options['wp'], moduleOptions);

  // this.addPlugin({
  //   src: resolve(__dirname, './templates/wp.plugin.js'),
  //   fileName: 'wp.plugin.js',
  //   options
  // });

    this.nuxt.hook('generate:before', async generator => {
      console.log(generator);
      // This will be called when a Nuxt generate starts
    }).then(function () {
        console.log("Promise Resolved");
    }).catch(function () {
        console.log("Promise Rejected");
    });
};

module.exports.meta = require('../package.json');

(node:35799) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): TypeError: this.nuxt.hook is not a function
get that error ;(

Because this issue seems to be inactive for quite some time, I'll close it now. If you feel like it deserves some attention because it's not fixed, feel free to ping me and I'll reopen it.

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

uptownhr picture uptownhr  路  3Comments

o-alexandrov picture o-alexandrov  路  3Comments

shyamchandranmec picture shyamchandranmec  路  3Comments

jaredreich picture jaredreich  路  3Comments

nassimbenkirane picture nassimbenkirane  路  3Comments