nuxt: setting `global` in `vite.define` breaks build

Environment


  • Operating System: Darwin
  • Node Version: v16.14.2
  • Nuxt Version: 3.0.0-rc.2
  • Package Manager: yarn@3.1.1
  • Builder: vite
  • User Config: ssr, runtimeConfig, typescript, css, buildModules, alias
  • Runtime Modules: -
  • Build Modules: @vueuse/nuxt@8.4.2, @intlify/nuxt3@0.1.10

Reproduction

Simply set these settings, and execute npx nuxi generate or nuxi build.

// nuxt.config.ts
export default defineConfig({
  // ...
  alias: {
    // ...
    './runtimeConfig': './runtimeConfig.browser',
  },
  vite: {
    // ...
    define: {
      "global": {},
    }
  }
});

Describe the bug

More precisely, it seems that the global variable conflicts with nuxt’s middleware or something similar. However, this error does not appear when running nuxi dev.

Additional context

This global parameter is the currently standard flag that is added to solve runtime issues with AWS Amplify. See #2308 for the related discussion.

Logs

------------------------------
67:   nuxtApp._activeRoute = reactive(activeRoute);
68:   nuxtApp._middleware = nuxtApp._middleware || {
69:     global: [],
        ^
70:     named: {}
71:   };


 ERROR  Unexpected token (Note that you need plugins to import files that are not JavaScript)   

 ------------------------------

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 16 (15 by maintainers)

Most upvoted comments

In that case the issue to follow is nuxt/nuxt.js#12830 linked above by @pi0.

Thanks @danielroe, is this an issue that is a high priority? It’s open for about a half year, I am not complaining whatsoever, just interested if it is something that can be fixed easily or that it is difficult to fix.

Thanks 😃

unjs/nitro#80

It’s not related to the Amplify hosting environment but to the Amplify SDK. Quite unfortunately, Amazon calls both the same way but they can be -and frequently are- used independently.

It looks like this is an upstream bug, either in vite or esbuild, rather than a Nuxt issue. See https://stackblitz.com/edit/github-apto8d

Would you raise an issue at https://github.com/vitejs/vite and comment here so we can track it?

@danielroe Here you go:

https://stackblitz.com/edit/github-qcrjhw

Some context:

Server Side Rendering is disabled, when enabled it crashes instantly on an issue with amplify. As you can see in the nuxt.config.ts a define global is present. In dev it works, if you use yarn build it will crash.

When you remove the define from nuxt.config.ts you will see the errors we encounter with amplify libs.

Thanks in advance.

In that case the issue to follow is nuxt/nuxt.js#12830 linked above by @pi0.