BLACK FRIDAY - Get 35% off your Mastering Nuxt license!

The globalName Property

Nuxt.js lets you customize the global ID used in the main HTML template as well as the main Vue instance name and other options.

  • Type: String
  • Default: nuxt
nuxt.config.js
{
  globalName: 'myCustomName'
}

The globalName needs to be a valid JavaScript identifier, and changing it may break support for certain plugins that rely on Nuxt-named functions. If you're looking to just change the visible __nuxt HTML ID, then use the globals property.

The globals property

Customizes specific global names which are based on globalName by default.

  • Type: Object
  • Default:
nuxt.config.js
globals: {
  id: globalName => `__${globalName}`,
  nuxt: globalName => `$${globalName}`,
  context: globalName => `__${globalName.toUpperCase()}__`,
  pluginPrefix: globalName => globalName,
  readyCallback: globalName => `on${_.capitalize(globalName)}Ready`,
  loadedCallback: globalName => `_on${_.capitalize(globalName)}Loaded`
},

Platinum Sponsors

StoryblokMoovweb Support Us