\n\nWhere I use config then, it shows me typing error.\nWhen I switch to the legacy tsconfig, typing issue are gone.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\nTypecheck summary: \n\n\n\napp/layouts/default.vue:35:33 - error TS2339: Property 'title' does not exist on type '{}'.\n\n35 title: appConfig.information?.title,\n ~~~~~\n\napp/layouts/default.vue:36:39 - error TS2339: Property 'description' does not exist on type '{}'.\n\n36 description: appConfig.information?.description,\n ~~~~~~~~~~~\n\napp/layouts/default.vue:39:36 - error TS2339: Property 'socials' does not exist on type '{}'.\n\n39 github: appConfig.information?.socials?.github,\n ~~~~~~~\n\napp/layouts/default.vue:40:38 - error TS2339: Property 'socials' does not exist on type '{}'.\n\n40 linkedin: appConfig.information?.socials?.linkedin,\n ~~~~~~~\n\napp/layouts/default.vue:41:40 - error TS2339: Property 'birthdate' does not exist on type '{}'.\n\n41 isBirthday: appConfig.information?.birthdate ? isBirthday(appConfig.information?.birthdate) : false,\n ~~~~~~~~~\n\napp/layouts/default.vue:41:86 - error TS2339: Property 'birthdate' does not exist on type '{}'.\n\n41 isBirthday: appConfig.information?.birthdate ? isBirthday(appConfig.information?.birthdate) : false,\n ~~~~~~~~~\n\napp/layouts/default.vue:44:27 - error TS2339: Property 'icons' does not exist on type '{}'.\n\n44 normal: appConfig.ui?.icons?.normal as string[] ?? [],\n ~~~~~\n\napp/layouts/default.vue:45:29 - error TS2339: Property 'icons' does not exist on type '{}'.\n\n45 birthday: appConfig.ui?.icons?.birthday as string[] ?? [],\n ~~~~~\n\napp/middleware/title.global.ts:5:28 - error TS2571: Object is of type 'unknown'.\n\n5 const appConfigTitle = useAppConfig().information.title;\n ~~~~~~~~~~~~~~~~~~~~~~~~~~\n\napp/pages/index.vue:14:62 - error TS2339: Property 'messages' does not exist on type '{}'.\n\n14 const messages = useState('randomIndex', () => appConfig.ui?.messages?.sort(() => Math.random() - 0.5))\n ~~~~~~~~\n\nnuxt.schema.ts:3:16 - error TS2304: Cannot find name 'defineNuxtSchema'.\n\n3 export default defineNuxtSchema({\n ~~~~~~~~~~~~~~~~\n\nnuxt.schema.ts:3:16 - error TS2304: Cannot find name 'defineNuxtSchema'.\n\n3 export default defineNuxtSchema({\n ~~~~~~~~~~~~~~~~\n\nnuxt.schema.ts:3:16 - error TS2304: Cannot find name 'defineNuxtSchema'.\n\n3 export default defineNuxtSchema({\n ~~~~~~~~~~~~~~~~\n```",[3042,3045],{"name":3043,"color":3044},"pending triage","E99695",{"name":3046,"color":3047},"possible regression","B90A42",32768,"useAppConfig lose types from nuxt schema with new tsconfig","2025-07-25T22:51:01Z","https://github.com/nuxt/nuxt/issues/32768",0.70379597,{"description":3054,"labels":3055,"number":3060,"owner":3032,"repository":3032,"state":3061,"title":3062,"updated_at":3063,"url":3064,"score":3065},"I have a application with nuxt and vuetify, I am creating a custom theme and adding color variables there, when my app intiially loads those color variables rendered empty and it shows black UI and after couple of seconds my vuetify components get colored.\n\nI have tried to debug the solution but could not any solution, so any help will be much appericiated.",[3056,3057],{"name":3043,"color":3044},{"name":3058,"color":3059},"needs reproduction","FBCA04",32706,"closed","Initially set vuetify color variables.","2025-07-21T16:12:08Z","https://github.com/nuxt/nuxt/issues/32706",0.65128607,{"description":3067,"labels":3068,"number":3072,"owner":3032,"repository":3032,"state":3061,"title":3073,"updated_at":3074,"url":3075,"score":3076},"I have a need, I want to create a company offical site, different company has different theme, and when visit one company page, I must specify the compnay id, and get the theme by the id from api (async), then render different UI component by different theme.\r\n\r\nfor example I visit `http://xxxx?company=1` will render the `red` theme and I visit `http://xxxx?company=2` will render the `blue` theme\r\n\r\nso I struct the project like: \r\n```\r\npages\r\n -red\r\n index.vue\r\n -blue\r\n index.vue\r\n```\r\n\r\nbut the result is nuxt always root the view page to `pages` can't specify a rule, so how can I realize this?\r\n\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1767\">#c1767\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3069],{"name":3070,"color":3071},"2.x","d4c5f9",1991,"How to dynamic switch theme","2023-01-18T15:42:54Z","https://github.com/nuxt/nuxt/issues/1991",0.67020637,{"labels":3078,"number":3084,"owner":3032,"repository":3032,"state":3061,"title":3085,"updated_at":3086,"url":3087,"score":3088},[3079,3082,3083],{"name":3080,"color":3081},"question","cc317c",{"name":3043,"color":3044},{"name":3070,"color":3071},6043,"Vuetify custom theme ignored by Nuxt","2023-01-22T15:33:07Z","https://github.com/nuxt/nuxt/issues/6043",0.67447996,{"description":3090,"labels":3091,"number":3099,"owner":3032,"repository":3033,"state":3061,"title":3100,"updated_at":3101,"url":3102,"score":3103},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.11.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.9\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: devtools, modules, runtimeConfig, app, css, ui, icon, i18n, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.1.0, @nuxt/eslint@1.3.0, @nuxtjs/device@3.2.4, @nuxtjs/i18n@9.5.3, @pinia/nuxt@0.11.0, @vueuse/nuxt@13.1.0, nuxt-lodash@2.5.3\n- Build Modules: -\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/vigorous-cerf-pnrc3g\n\n// app.config.ts\nexport default defineAppConfig({\n ui: {\n colors: {\n primary: 'emerald',\n neutral: 'zinc',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n green: 'green',\n blue: 'blue',\n purple: 'purple',\n gray: 'gray',\n },\n }\n}\n\n// nuxt.config.ts\n\nui: {\n theme: {\n colors: [ 'primary', 'secondary', 'success', 'info', 'warning', 'error', 'red', 'orange', 'yellow', 'green', 'blue', 'purple', 'gray' ],\n },\n },\n\n### Description\n\nYesterday everything was working fine, no code was changed, after the upgrade it broke.\nFor example:\n```html\n\u003Cdiv class=\"bg-(--ui-orange)\">\n```\nOr\n```html\n\u003Cdiv class=\"bg-orange\">\n```\nBoth not work\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3092,3095,3096],{"name":3093,"color":3094},"bug","d73a4a",{"name":3024,"color":3025},{"name":3097,"color":3098},"triage","ffffff",3977,"Extend colors not work after update to v3.1","2025-04-28T10:40:09Z","https://github.com/nuxt/ui/issues/3977",0.67851186,{"description":3105,"labels":3106,"number":3111,"owner":3032,"repository":3033,"state":3061,"title":3112,"updated_at":3113,"url":3114,"score":3115},"### Description\n\nHi, \nI'm struggling to customize my components when using Nuxt UI within another Nuxt Module, I've search but cannot get it to work, tried with using app.config.ts like below and also within module.ts but no joy, would appreciate if someone could help out.\n\n\n```\nexport default defineAppConfig({\n ui: {\n button: {\n slots: {\n base: 'rounded-full font-semibold cursor-pointer'\n },\n },\n }\n})\n\n```\nMy module.ts file:\n\n```\nimport { defineNuxtModule, installModule, createResolver } from '@nuxt/kit'\n\nexport default defineNuxtModule\u003CModuleOptions>({\n meta: {\n name: 'my-module',\n configKey: 'myModule',\n },\n hooks: {\n 'nitro:config': (nitroConfig) => {\n const { resolve } = createResolver(import.meta.url)\n\n nitroConfig.publicAssets ||= []\n nitroConfig.publicAssets.push({\n dir: resolve('./runtime/images/'),\n maxAge: 60 * 60 * 24 * 365,\n })\n },\n },\n defaults: {},\n async setup(_options, _nuxt) {\n const { resolve } = createResolver(import.meta.url)\n\n\n await installModule('@nuxt/ui')\n await installModule('nuxt-svgo', {\n autoImportPath: resolve('./runtime/icons'),\n defaultImport: 'component',\n componentPrefix: 'i',\n })\n\n _nuxt.options.css.push(resolve('./runtime/style.css'))\n },\n})\n\n```",[3107,3109,3110],{"name":3080,"color":3108},"d876e3",{"name":3024,"color":3025},{"name":3030,"color":3028},3679,"How to override components style globally when using within another Nuxt Module?","2025-06-11T10:32:59Z","https://github.com/nuxt/ui/issues/3679",0.67852855,{"labels":3117,"number":3119,"owner":3032,"repository":3032,"state":3061,"title":3120,"updated_at":3121,"url":3122,"score":3123},[3118],{"name":3070,"color":3071},7231,"Colors in global scss","2023-01-18T15:36:21Z","https://github.com/nuxt/nuxt/issues/7231",0.6817315,{"description":3125,"labels":3126,"number":3132,"owner":3032,"repository":3033,"state":3061,"title":3133,"updated_at":3134,"url":3135,"score":3136},"### Description\n\nHi\n\nThis is the approach I took personally with my own ui framework and it works really nicely. \n\nBasically it would be amazing to be able to define project level themes (in the project level /themes dir perhaps). Inside here you’d have your theme name as the directory (this is how you reference the theme) and then inside there you add TV overrides. \n\n#### Project:\n\n```md\n/themes\n theme-a\n button.ts\n```\n\nThen at the ui.config level or at the component level the user can then set the theme, which sets the styles for the component. \n\n#### app.config:\n\n```ts\nui: {\n theme: “theme-a”, // would override all components \n components: {\n button: {\n theme: “theme-a” // would override button theme globally\n theme: {\n extend: true,\n theme: “theme-a” // merges theme-a with NuxtUI button theme\n }\n }\n }\n}\n```\n\nCan set theme at component level too. Also could introduce an api for extending base theme rather than replacing, meaning user wouldn’t provide overrides. \n\n```vue\n\u003CUButton theme=“theme-a”>button\u003C/UButton>\n```\n\nIt would be nice to be able to choose whether the theme extends the NuxtUI or replaces for that specific component or use on the component. \n\nPersonally I created a `createTheme` module which handle this for every component. Naturally the heavy lifting here uses vite imports for pulling in project themes, and TailwindVariants to do the cascading merging of tv objects. \n\nWould make NuxtUI unbeatable in terms of being able to customise and theme components. \n\n### Additional context\n\n_No response_",[3127,3128,3129,3130,3131],{"name":3021,"color":3022},{"name":3024,"color":3025},{"name":3097,"color":3098},{"name":3027,"color":3028},{"name":3030,"color":3028},3393,"Set project level named themes","2025-06-18T09:01:54Z","https://github.com/nuxt/ui/issues/3393",0.68514144,{"description":3138,"labels":3139,"number":3141,"owner":3032,"repository":3032,"state":3061,"title":3142,"updated_at":3143,"url":3144,"score":3145},"I'm working in a project that have different users with their logos. Based on the API call I want to load a different CSS with different colour palette.\r\n\r\nNow I have a css folder inside assets folder with main.js (with my custom font styles, etc) and another files in there for the custom color palette: \u003Ccolor-name>-palette.css.\r\n\r\nIn my nuxt.config I'm calling the CSS colour like that:\r\n\r\n `css: [\r\n ' ~/assets/style/app.styl ',\r\n ' ~/assets/css/main.css ',\r\n ' ~/assets/css/orange-palette.css '\r\n ],`\r\n\r\nIs there any way to bind the CSS file depending on the URL path/API call instead of putting the path there?\r\n\r\nI'm not sure if I can use it on templates as well, binding the CSS files in there. Is it possible?\r\n\r\nThanks\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c8664\">#c8664\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3140],{"name":3070,"color":3071},5040,"[Help] How to use dynamic CSS files with Nuxt?","2023-01-18T20:10:40Z","https://github.com/nuxt/nuxt/issues/5040",0.68649197,["Reactive",3147],{},["Set"],["ShallowReactive",3150],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fu5xLNOkFWv72SxfO_0FRQjsOCqGUPCbdceGemU45rZs":-1},"/nuxt/ui/3952"]