\r\n```\r\n\r\nIn another component, if style is generated by computed(), it also returns hydration style mismatch.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2935,2936,2937,2940],{"name":2878,"color":2879},{"name":2881,"color":2882},{"name":2938,"color":2939},"upstream","E8A36D",{"name":2884,"color":2885},25045,"[Nuxt 3.9] - Hydration STYLE mismatch","2024-01-05T08:42:27Z","https://github.com/nuxt/nuxt/issues/25045",0.7131066,{"labels":2947,"number":2950,"owner":2868,"repository":2868,"state":2887,"title":2951,"updated_at":2952,"url":2953,"score":2954},[2948,2949],{"name":2878,"color":2879},{"name":2881,"color":2882},13304,"font rejected by sanitizer in production","2023-01-19T16:51:51Z","https://github.com/nuxt/nuxt/issues/13304",0.713365,{"description":2956,"labels":2957,"number":2965,"owner":2868,"repository":2868,"state":2887,"title":2966,"updated_at":2967,"url":2968,"score":2969},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Darwin\r\n- Node Version: v20.2.0\r\n- Nuxt Version: 3.6.0\r\n- Nitro Version: 2.5.1\r\n- Package Manager: yarn@1.22.19\r\n- Builder: vite\r\n- User Config: $production, css, runtimeConfig, vue, typescript, modules, nitro, vite\r\n- Runtime Modules: @nuxtjs/google-fonts@3.0.1, nuxt-jsonld@2.0.8\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/custom-fonts?file=app.vue\r\n\r\nRun\r\n\r\n```\r\n$ npm run build\r\n$ node .output/server/index.mjs\r\n```\r\n\r\n### Describe the bug\r\n\r\nWhen I reference a custom font in a CSS file, it works in the development environment. However, when I build the project for production, it appears that the font is not included in the production build.\r\n\r\nNote this problem only occurs in the newest Nuxt release, version 3.6\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2958,2959,2962],{"name":2878,"color":2879},{"name":2960,"color":2961},"workaround available","11376d",{"name":2963,"color":2964},"❗ p4-important","D93F0B",21784,"Fonts are not included in production build","2023-06-26T12:31:28Z","https://github.com/nuxt/nuxt/issues/21784",0.7145956,{"description":2971,"labels":2972,"number":2975,"owner":2868,"repository":2868,"state":2887,"title":2976,"updated_at":2977,"url":2978,"score":2979},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Darwin\r\n- Node Version: v20.5.0\r\n- Nuxt Version: 3.6.5\r\n- Nitro Version: 2.5.2\r\n- Package Manager: pnpm@8.6.10\r\n- Builder: vite\r\n- User Config: devtools, css\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\n1. Import a font using `@import` from Google Fonts or load a font from local files.\r\n**~/assets/css/main.css with import**\r\n\r\n```\r\n@import url('https://fonts.googleapis.com/css2?family=Lexend+Exa&display=swap');\r\n\r\n* {\r\n /* background-color: #0E0E0E; */\r\n background-color: white;\r\n font-family: 'Lexend Exa', sans-serif !important;\r\n}\r\n```\r\n\r\n**OR ~/assets/css/main.css** with **@font-face**\r\n```\r\n@font-face {\r\n font-family: 'Lexend Exa';\r\n src: url('/fonts/LexendExa-Regular.woff2') format('woff2');\r\n}\r\n\r\n* {\r\n /* background-color: #0E0E0E; */\r\n background-color: white;\r\n font-family: 'Lexend Exa', sans-serif;\r\n}\r\n```\r\n\r\n**nuxt.config.ts** \r\n`css: [\"~/assets/css/main.css\"]`\r\n\r\n2. Assign the imported or local font to an element using the `font-family` CSS property.\r\n3. Open the project in Google Chrome and inspect the element.\r\n\r\n### Describe the bug\r\n\r\nI'm encountering an issue in my Nuxt.js project where fonts, either imported from Google Fonts or loaded from local files, aren't being applied in Google Chrome. In Chrome's Developer Tools, the `font-family` property is crossed out. Even when using `!important`, the font doesn't change. The issue does not appear in Mozilla Firefox where the font displays correctly. In addition, I'm receiving a console error in Chrome stating: `\"Error with Permissions-Policy header: Origin trial controlled feature not enabled: 'browsing-topics'.\"`\r\n\r\n\r\n### Additional context\r\n\r\n- The issue persists irrespective of the source of the font (Google Fonts or locally hosted).\r\n- The `@import` statement for the font is placed at the top of the CSS file.\r\n- The URL for the Google Font is correctly specified and accessible.\r\n\r\nDespite numerous troubleshooting steps, the issue remains unresolved in Google Chrome. Any assistance or guidance to address this issue would be greatly appreciated.\r\n\r\n### Logs\r\n\r\n_No response_",[2973,2974],{"name":2878,"color":2879},{"name":2881,"color":2882},22388,"Font Loading Issue in Chrome with Permissions-Policy Header Error","2023-07-30T02:43:18Z","https://github.com/nuxt/nuxt/issues/22388",0.7159961,["Reactive",2981],{},["Set"],["ShallowReactive",2984],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fGRL1D3AwB1FYNaBa1y7k9LWJzc26J7Pu8pdZ9dCOfpg":-1},"/nuxt/fonts/634"]