3

In the past days I have kind of a headache with this and it's surely due to my lack of experience. I recently started using nuxt and nuxt modules.

As I use the command yarn create nuxt-app my-project, the nuxt.config.js file is populated with module.exports. My problem is that when I was installing certain modules, the configuration was only working in export default. I have for example the following config:

  build: {
      extend (config, { isDev, isClient }) {
      if (isDev && isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        })
      }
    }
  }

This configuration only works inside export default but not when I write it in module.exports, I have no clue about the reason.

Another example is with head, let's say the following code:

  head: {
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.png' }
    ]
  },

When I put it in export default, it doesn't work, and in module.exports it works. So, until now I'm doing trial and error depending where it works.

I know that there is a reference in the question module.exports vs. export default in Node.js and ES6 . However it's not yet clear to me why some stuff work in module.exports and some other stuff in export default.

Some explanation would be highly appreciated.

silgon
  • 6,890
  • 7
  • 46
  • 67
  • Can you clarify how exactly it didn't work? What was the error message? The difference between `export` and `module.exports` in *transpiled* environment is determined how ES/CommonJS module interoperation works (depends on Webpack/Babel/TS config). In user land, `module.exports` is usually interchangeable with `export default` because CommonJS module exports are treated as default exports. In some configs `module.exports` is interchangeable with `export { }`. I can't check how module interop works in Nuxt configs. Try `exports.default = ` instead of `module.exports`, let me know if this works. – Estus Flask Feb 23 '20 at 10:36
  • In my case, [nuxt.config.ts] does not load the configuration under the conditions of [export default config] and [exports.default = config]. – Lancer.Yan Jul 06 '20 at 02:59

1 Answers1

-1

I'm having a similar problem... trying to effect 'disable Nuxt/no-cjs-in-config for this line' in order to be able to use module.exports = but it keep reverting back to export default when I run firebase deploy --only functions in my terminal and throwing syntaxError

ASaintlammy
  • 19
  • 1
  • 5
  • From Review: Hi, "I'm having this problem too" cannot be considered an answer in S.O. rules. Please post this as a comment to the question. – sɐunıɔןɐqɐp Feb 08 '21 at 12:29