Runtime component customization with updateAppConfig

[izoukhai]

For what version of Nuxt UI are you asking this question?

v3.0.0-alpha.x

Description

I want to customize my app.config.ts file from an external source.

Consider the following:

// plugins/config.ts

export default defineNuxtPlugin({
  async setup(nuxtapp) {
    const config = await fetchConfig()
    // output: {ui: {primary: "violet", button: {slots: {base: "hidden"}}}}

    if (config?.app_config) {
      updateAppConfig(config.app_config);
    }
  },
});

The primary color is updated correctly, but the hidden class is not applied to buttons. Any ideas why?

[benjamincanac]

This is nice idea! However, the issue is components merge the default config with #build/app.config for performance reasons, this is one of the reason HMR is not working when changing the App Config and you have to reload the page.

[izoukhai]

Hey @benjamincanac thanks for the answer!

So I guess it's not possible, unless I manage to call updateAppConfig before Nuxt UI reads app.config.ts ?