\n \u003Ctemplate #content>\n \u003Cdiv class=\"p-4\">\n \u003CUSelectMenu\n v-model=\"value\"\n :search-input=\"{\n placeholder: 'Filter...',\n icon: 'i-lucide-search',\n }\"\n :items=\"items\"\n class=\"w-48\"\n />\n \u003C/div>\n \u003C/template>\n \u003C/UDrawer>\n\u003C/template>\n```\n\n### Description\n\nSelectMenu search not working from drawer\n\n### Additional context\n\n\u003Cimg width=\"245\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/19831047-5117-4e6a-a464-bae275272d07\" />\n\n### Logs\n\n```shell-script\n\n```",[2010,2013],{"name":2011,"color":2012},"bug","d73a4a",{"name":2014,"color":2015},"v3","49DCB8","ui","SelectMenu search not clickable from drawer","2025-02-27T21:17:38Z","https://github.com/nuxt/ui/issues/3396",{"description":2021,"labels":2022,"number":2027,"owner":1991,"repository":1991,"state":1992,"title":2028,"updated_at":2029,"url":2030,"score":2031},"### Environment\n\n- Operating System: Linux\r\n- Node Version: v18.16.0\r\n- Nuxt Version: 3.8.1\r\n- CLI Version: 3.9.1\r\n- Nitro Version: 2.7.2\r\n- Package Manager: npm@9.6.7\r\n- Builder: -\r\n- User Config: app, devtools, runtimeConfig, modules, cloudinary\r\n- Runtime Modules: @nuxtjs/cloudinary@2.4.3, @nuxtjs/google-fonts@3.0.2\r\n- Build Modules: -\n\n### Reproduction\n\n https://stackblitz.com/github/R0N1n-dev/nuxt-issues\n\n### Describe the bug\n\nCannot get script imports to work according to docs\r\nError on starting server with Upload component already on home page\r\n\r\n\r\n\r\n\r\n\r\nHowever if i remove the Upload component and put it back on the page after server start, it works fine. So the script is not read at the beginning.\r\n\r\n\r\n\r\n\r\n\r\nMy config looks like this\r\n\r\n\r\nEven if i try in the component with useHead\r\n\r\n\r\n\r\n\r\nHow do i Import a script from a cdn to work in nuxt 3?????\r\n\r\n\n\n### Additional context\n\nNuxt config provides way to add scripts to head but its not working for me with this particular script\n\n### Logs\n\n_No response_",[2023,2026],{"name":2024,"color":2025},"3.x","29bc7f",{"name":1985,"color":1986},24424,"Scripts in head not working","2023-11-23T09:54:15Z","https://github.com/nuxt/nuxt/issues/24424",0.6665471,{"description":2033,"labels":2034,"number":2040,"owner":1991,"repository":1991,"state":1992,"title":2041,"updated_at":2042,"url":2043,"score":2044},"### Version\n\n[v2.4.3](https://github.com/nuxt.js/releases/tag/v2.4.3)\n\n### Reproduction link\n\n[https://github.com/markplewis/nuxt-external-resource-loading-issue](https://github.com/markplewis/nuxt-external-resource-loading-issue)\n\n### Steps to reproduce\n\nClone [my demo repo](https://github.com/markplewis/nuxt-external-resource-loading-issue) and then do the following:\n\n## Case 1\n\n1. Launch the app via `npm run dev` and open it up in your browser.\n2. Click the \"Test 1\" link.\n3. The following error will appear in your console:\n```\nTypeError: window.jQuery is not a function\n at VueComponent.mounted (test-1.js:34)\n```\n4. Refresh the page.\n5. Everything will load correctly.\n6. Click the \"Home\" link.\n7. Click the \"Test 1\" link.\n8. Everything will load correctly.\n9. Click the \"Home\" link.\n10. Refresh the page.\n11. Click the \"Test 1\" link.\n12. The following error will appear in your console:\n```\nTypeError: window.jQuery is not a function\n at VueComponent.mounted (test-1.js:34)\n```\n13. Refresh the page.\n14. Everything will load correctly.\n\n## Case 2\n\n1. Launch the app via `npm run dev` and open it up in your browser.\n2. Click the \"Test 2\" link.\n3. The \"(CDN script has loaded)\" message will **not** be appended to the `\u003Ch1>` element.\n4. Refresh the page.\n5. The \"(CDN script has loaded)\" message will appear inside the `\u003Ch1>`.\n6. Click the \"Home\" link.\n7. Click the \"Test 2\" link.\n8. The \"(CDN script has loaded)\" message will appear inside the `\u003Ch1>`.\n9. Click the \"Home\" link.\n10. Refresh the page.\n11. Click the \"Test 2\" link.\n12. The \"(CDN script has loaded)\" message will **not** be appended to the `\u003Ch1>` element.\n13. Refresh the page.\n14. The \"(CDN script has loaded)\" message will appear inside the `\u003Ch1>`.\n\n### What is expected ?\n\nI'm trying to load an external script into a Nuxt page via the page's `head`:\n```\nhead() {\n return {\n script: [{\n src: \"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.slim.min.js\"\n }]\n };\n}\n```\nI expect the script to load and be available every time the page loads, regardless of whether it was served directly from the server or rendered on the client-side.\n\n### What is actually happening?\n\nUnfortunately, the external script doesn't seem to load when the page is server-rendered - it only seems to work when the page is client-rendered. I discovered the following issues, but neither of them have helped me solve this problem:\n\n- https://github.com/nuxt/nuxt.js/issues/3396\n- https://github.com/nuxt/nuxt.js/issues/3872\n\nIn that first issue, manniL said the following:\n\n> \"Loading external scripts through the head function works fine for me. I'd suggest to do this on a `layout` basis anyway. For pages there is the caveat that you can't ensure the readiness easily.\"\n\nWhat does \"you can't ensure the readiness easily\" mean? I'd prefer not to move this script into my layout because it will only be needed for one particular page, and I don't want to force users to download unnecessary resources.\n\nI can avoid errors (see test case 1, above) by wrapping my calls to `window.jQuery`, like this: \n```\nmounted() {\n if (!process.server && window.jQuery) {\n ... \n }\n}\n```\nBut this leaves me with the problem that I described in test case 2 (see above).\n\n\n\n\n\n\u003C!--cmty-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c8677\">#c8677\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2035,2038,2039],{"name":2036,"color":2037},"stale","ffffff",{"name":1985,"color":1986},{"name":1988,"color":1989},5052,"External script doesn't always load when added to Nuxt page via \"head()\"","2023-05-03T05:33:32Z","https://github.com/nuxt/nuxt/issues/5052",0.6715507,{"description":2046,"labels":2047,"number":2050,"owner":1991,"repository":1991,"state":1992,"title":2051,"updated_at":2052,"url":2053,"score":2054},"### Version\n\n[v2.6.2](https://github.com/nuxt.js/releases/tag/v2.6.2)\n\n### Reproduction link\n\n[https://codesandbox.io/s/vzxv41wry](https://codesandbox.io/s/vzxv41wry)\n\n### Steps to reproduce\n\nPlease check this: https://codesandbox.io/s/vzxv41wry Note that inside `about.vue`, I have loaded javascript (as instructed here: https://nuxtjs.org/faq/#local-settings ) But if I visit /about, the app throws an error saying `$ is not defined`. Is this a bug?\n\n### What is expected ?\n\n/about should have access to $\n\n### What is actually happening?\n\n/about throws an error saying $ is not defined\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c9098\">#c9098\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2048,2049],{"name":1985,"color":1986},{"name":1988,"color":1989},5594,"No access to locally loaded javascript via head()","2023-01-22T15:33:04Z","https://github.com/nuxt/nuxt/issues/5594",0.68637896,{"labels":2056,"number":2060,"owner":1991,"repository":1991,"state":1992,"title":2061,"updated_at":2062,"url":2063,"score":2064},[2057,2058,2059],{"name":2036,"color":2037},{"name":1985,"color":1986},{"name":1988,"color":1989},8293,"Head scripts fire twice on initial page load","2023-01-22T15:38:17Z","https://github.com/nuxt/nuxt/issues/8293",0.68925107,{"labels":2066,"number":2069,"owner":1991,"repository":1991,"state":1992,"title":2070,"updated_at":2071,"url":2072,"score":2073},[2067,2068],{"name":1985,"color":1986},{"name":1988,"color":1989},8665,"Problem with a dynamic added scripts in dev mode","2023-01-22T15:38:40Z","https://github.com/nuxt/nuxt/issues/8665",0.6893361,{"description":2075,"labels":2076,"number":2080,"owner":1991,"repository":1991,"state":1992,"title":2081,"updated_at":2082,"url":2083,"score":2084},"### Version\n\n[v2.3.4](https://github.com/nuxt.js/releases/tag/v2.3.4)\n\n### Reproduction link\n\n[https://codesandbox.io/s/jzw6n96vj3](https://codesandbox.io/s/jzw6n96vj3)\n\n### Steps to reproduce\n\nThe sample demo just shows a very simple example of the problem. The app is in 'spa' mode.\n1. Load jquery as part of `head` in nuxt.config.js, and reference `$` in the mounted event of a page, and it works fine.\n2. Load jquery as part of `head` in pages/layouts, and reference `$` in the mounted event of a page, and you get the error: `$ is undefined`\n\nThe problem is the inconsistency of using `head` between nuxt.config and pages/layouts. Or at least the difference imo should be documented.\n\n### What is expected ?\n\n`head` should behave the same in both nuxt.config.js and pages/layouts.\nIn `spa` mode and for `nuxt generate`, I would expect that any link/script loaded from `head` would all get placed at the top of the \u003Chead> element in the html.\n\n### What is actually happening?\n\n`head` does not behave the same, depending on where you implement it. Instead, only nuxt.config.js ones do. The ones loaded from pages/layouts are dynamically loaded and get placed AFTER the code that is compiled from the *.vue files.\n\n### Additional comments?\n\nThe point of having `head` is to give developers the ability to guarantee loading of scripts and css before anything else in the app or on the page. At least that's how I interpret it. Instead, the expected behavior is only exhibited when using nuxt.config.js, and not pages/layouts as the documentation seems to suggest.\n\nI have an app that uses a variety of layouts (i.e.: frontend, backend, etc..). We don't want to have to put all the scripts for all sections of the site into nuxt.config.js. We also use the `splitChunks.layouts: true feature`, as well as `extractCSS`. We're stuck with themes with JS that aren't available in es6 and are full of IIFEs. We need to make sure the scripts in each section of the site are loaded and available before in code inside the mounted event fires.\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c8412\">#c8412\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2077,2078,2079],{"name":2036,"color":2037},{"name":1985,"color":1986},{"name":1988,"color":1989},4694,"Inconsistent behavior when using `head` meta property between nuxt.config.js and pages/layouts.","2023-01-22T15:30:09Z","https://github.com/nuxt/nuxt/issues/4694",0.6899796,{"labels":2086,"number":2091,"owner":1991,"repository":1991,"state":1992,"title":2092,"updated_at":2093,"url":2094,"score":2095},[2087,2090],{"name":2088,"color":2089},"question","cc317c",{"name":1988,"color":1989},7960,"New Relic Browser Implementation","2023-01-18T15:33:00Z","https://github.com/nuxt/nuxt/issues/7960",0.69143534,["Reactive",2097],{},["Set"],["ShallowReactive",2100],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"XyTjbQ5yc2tlVIez_y5ir4P0CcmCEEHiDYEq0O0gUTQ":-1},"/nuxt/ui/3872"]