Static GitHub Issues

[536] Some advices on making nuxt more programmatic friendly

prev: FeatherJS Client globally not visible
next: How to enable gzip in development mode?

Hi, guys, I'm using nuxt programmatically in an express project, and met some unpleasant experiences.

  1. The > Open http://127.0.0.1:3000 log is misleading

image

The server is served by express not nuxt at http://localhost:8088 in this case.

Advice No.1: nuxt should provide a way to suppress this logs.

  1. Event-Oriented Programming but not just callback

In order to capture the time when nuxt has completed its webpack compiling job, currently i've to write a webpack plugin and plug it into the configs of nuxt, it's hacked..

/**
 * webpack plugin for capturing nuxt's building process
 * https://github.com/webpack/docs/wiki/plugins
 */
class XWebpack extends EventEmitter {
  constructor (opts) {
    super()
    this.opts = opts || {}
  }
  apply (compiler) {
    let timer = null
    compiler.plugin('done', (stats) => {
      clearTimeout(timer)
      timer = setTimeout(() => {
        if (!stats.hasErrors() && !stats.hasWarnings()) {
          // clear the nuxt output
          xconsole.clearConsole()
          this.emit(this.EVENTS.done)
        }
      }, 500)
    })
  }
  get EVENTS () {
    return {
      'done': 'done'
    }
  }
}

The ideal usage should look like,

var nuxt = new Nuxt(opts)
nuxt.on('compiled', () => {
    // let user rocks here
})

Advice No.2 is: Let nuxt emit those key events for further programmatic usage.

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This feature request is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c461">#c461</a>)</em></sub></div>