Nuxt.js: Async in module.exports : "Cannot assign to read only property 'exports' of object '#<Object>'"

[yann-yinn]

Hello !
Anyone know what's wrong using async in Nuxt.js module.exports ?
This works well if i simply return a Promise without async & await stuff.

module.exports = {

  async getPosts (perPage = 10) {
    const {data} = await axios.get(endpoint + '/posts?_embed&per_page=' + perPage)
    return data
  }

}

_{This question is available on Nuxt.js community (#c747)}

[Atinux]

Hi @nyl-auster

Where are you using async/await in your project?

If it's in nuxt.config.js, you need to use at least node 7 or 8.

[yann-yinn]

Hi ! It's a custom module to fetch Content from wordpress API with _axios_, it is called from "asyncData" function of my components pages. Here is my terminal output :

nuxt:render Rendering url /posts/ +6s
[vue-router] Failed to resolve async component default: TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
[vue-router] uncaught error during route navigation:
TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
    at Object.<anonymous> (2.server-bundle.js:45:16)

[pi0]

@nyl-auster If possible please provide code snipped (or js file) used to fetch. Also suggest using axios module for better nuxt integration :)

[yann-yinn]

@pi0 Here it is.
Works fine if i call this module from a test file launched with nodejs command in a terminal.

/**
 * Get content from wordpress via REST Api
 */
const endpoint = 'https://public-api.wordpress.com/wp/v2/sites/yineo.fr'
const axios = require('axios')

module.exports = {

  async getPosts (perPage = 10) {
    const {data} = await axios.get(endpoint + '/posts?_embed&per_page=' + perPage)
    return data
  }

}

[yann-yinn]

@pi0 oups sorry ... this is a dedicated file located in "services/wpContentApi.js".

[pi0]

Working demo:
https://glitch.com/edit/#!/nippy-guilty?path=api.js:8:3
https://nippy-guilty.glitch.me/

[yann-yinn]

@pi0 thanks ! but if i use _export default_ instead of _require_ in my Vue component; i can't run anymore my file from the server, correct ?
I use this service from server to "pre-fetch" some results, launched by "node" command, is there a way to "require" or "import it" that works both for client and server ? Sorry for the noob questions !

SyntaxError: Unexpected token export

[pi0]

@nyl-auster I'm sorry but from webpack/webpack#4039 this is stated:

You can mix require and export. You can't mix import and module.exports.

So i think for your launcher script ( if it is separated from nuxt and needs require api.js) you may use babel-node that adds import/export support on the fly :)

[yann-yinn]

okay, thanks a lot for your time

[lock[bot]]

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.