\n\u003C!-- OR -->\n\u003CIcon name=\"my-icon:a\" v-if=\"flag\" />\n\u003CIcon name=\"my-icon:b\" v-else />\n```\nin `nuxt.config.ts`\n```ts\nicon: {\n provider: 'server',\n customCollections: [\n {\n prefix: 'my-icon',\n dir: './assets/icon/svg',\n },\n ],\n},\n// ...\nnitro: {\n preset: 'static',\n},\n```\n\nIf toggle value of `flag`, \neverything works well in development, \nbut it throws 404 error for `my-icon:b` after building and generating.\n(it works well with `v-show`) \n\nProject info:\n```\n------------------------------\n- Operating System: Windows_NT\n- Node Version: v22.8.0\n- Nuxt Version: 3.16.0\n- CLI Version: 3.23.0\n- Nitro Version: 2.11.6\n- Package Manager: pnpm@9.9.0\n- Builder: -\n- User Config: modules, icon, colorMode, shadcn, fonts, googleSignIn, app, imports, css, vite, nitro, compatibilityDate, telemetry\n- Runtime Modules: @nuxtjs/tailwindcss@6.13.2, @nuxt/icon@1.11.0, @nuxt/fonts@0.11.0, @nuxt/image@1.9.0, @nuxt/eslint@1.2.0, @pinia/nuxt@0.10.1, pinia-plugin-persistedstate/nuxt@4.2.0, @nuxt/test-utils/module@3.17.2, @nuxtjs/color-mode@3.5.2, shadcn-nuxt@1.0.3, @vueuse/nuxt@13.0.0, nuxt-vue3-google-signin@0.0.11\n- Build Modules: -\n------------------------------\n```\n",[],380,"nuxt","icon","open","Local icon 404 after `nuxi generating` if with `:name=\"flag?'my-icon:icon-a':'my-icon:icon-b'\"`","2025-03-26T15:31:52Z","https://github.com/nuxt/icon/issues/380",0.458838,{"description":2865,"labels":2866,"number":2870,"owner":2857,"repository":2871,"state":2859,"title":2872,"updated_at":2873,"url":2874,"score":2875},"### Environment\r\n\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.9.3\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: devtools, modules\r\n- Runtime Modules: @nuxt/test-utils/module@3.11.0\r\n- Build Modules: -\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-3etpwp?file=package.json\r\n\r\n### Describe the bug\r\n\r\nIf you have test files in your `pages` folder importing `@nuxt/test-utils/runtime`, the following error pops up when starting the project\r\n\r\n``` \r\nERROR This module cannot be imported in the Vue part of your app. [importing @nuxt/test-utils/runtime from pages/\u003Ctestname>.ts]\r\n```\r\n\r\nThe error does not seem to have effect on the app startup itself (it's probably more a warning).\r\n\r\nThe error goes away when moving the test out of the `pages` folder.\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2867],{"name":2868,"color":2869},"bug","d73a4a",747,"test-utils","Error: This module cannot be imported in the Vue part of your app","2025-04-09T01:04:25Z","https://github.com/nuxt/test-utils/issues/747",0.66257614,{"description":2877,"labels":2878,"number":2856,"owner":2857,"repository":2871,"state":2879,"title":2880,"updated_at":2881,"url":2882,"score":2863},"Example in https://test-utils.nuxtjs.org/api-reference/app-testing not working. \r\nAfter run test get error:\r\n\r\n```\r\n/firsttest.spec.js:1\r\n({\"Object.\u003Canonymous>\":function(module,exports,require,__dirname,__filename,global,jest){import { get, setupTest } from '@nuxt/test-utils';\r\n\r\nSyntaxError: Cannot use import statement outside a module\r\n```\r\nmy setup:\r\n\r\nin jest.config.js\r\n```\r\nmodule.exports = {\r\n clearMocks: true,\r\n testMatch: [\r\n '*/__tests__/**/*.[jt]s?(x)',\r\n '**/?(*.)+(spec|test).[tj]s?(x)',\r\n '**/test/(*.)+(spec|test).js'],\r\n moduleNameMapper: {\r\n '^@/(.*)$': '\u003CrootDir>/$1',\r\n '^~/(.*)$': '\u003CrootDir>/$1',\r\n },\r\n moduleFileExtensions: ['js', 'vue', 'json'],\r\n testEnvironment: 'jsdom',\r\n transform: {\r\n '^.+\\\\.js$': 'babel-jest',\r\n '.*\\\\.(vue)$': 'vue-jest',\r\n },\r\n preset: '@nuxt/test-utils',\r\n}\r\n```\r\nin package.json\r\n```\r\n{\r\n \"name\": \"\",\r\n \"version\": \"1.0.0\",\r\n \"main\": \"index.js\",\r\n \"scripts\": {\r\n \"test\": \"node_modules/.bin/jest\"\r\n },\r\n \"author\": \"\",\r\n \"license\": \"\",\r\n \"dependencies\": {\r\n \"bootstrap\": \"^4.5.3\",\r\n \"bootstrap-vue\": \"^2.20.1\",\r\n \"nuxt\": \"^2.15.2\",\r\n\r\n },\r\n \"devDependencies\": {\r\n \"@babel/plugin-transform-modules-commonjs\": \"^7.12.1\",\r\n \"@nuxt/test-utils\": \"^0.2.0\",\r\n \"@vue/test-utils\": \"^1.1.1\",\r\n \"babel-jest\": \"^26.6.3\",\r\n \"jest\": \"^26.6.3\",\r\n \"vue-jest\": \"^3.0.7\"\r\n }\r\n}\r\n\r\n```\r\n\r\n\r\n",[],"closed","Example in https://test-utils.nuxtjs.org/api-reference/app-testing not working","2023-12-02T00:13:09Z","https://github.com/nuxt/test-utils/issues/380",{"description":2877,"labels":2884,"number":377,"owner":2857,"repository":2871,"state":2879,"title":2880,"updated_at":2885,"url":2886,"score":2863},[],"2023-12-02T00:13:13Z","https://github.com/nuxt/test-utils/issues/481",{"description":2888,"labels":2889,"number":2893,"owner":2857,"repository":2871,"state":2879,"title":2894,"updated_at":2895,"url":2896,"score":2897},"When I tried to use the library I got this error: \r\n\r\n\r\nIf I only use jest or testing library they do work, I am quite confused. Any ideas?\r\n\r\nThis is my jest.config.js:\r\n```\r\nmodule.exports = {\r\n moduleNameMapper: {\r\n '^@/(.*)$': '\u003CrootDir>/$1',\r\n '^~/(.*)$': '\u003CrootDir>/$1',\r\n '^@atoms/(.*)$': '\u003CrootDir>/components/common/atoms/$1',\r\n '^@molecules/(.*)$': '\u003CrootDir>/components/common/molecules/$1',\r\n '^@organisms/(.*)$': '\u003CrootDir>/components/common/organisms/$1',\r\n '^@checkout/(.*)$': '\u003CrootDir>/components/private/checkout/$1',\r\n '^vue$': 'vue/dist/vue.common.js'\r\n },\r\n moduleFileExtensions: ['js', 'vue', 'json'],\r\n transform: {\r\n '^.+\\\\.js$': 'babel-jest',\r\n '.*\\\\.(vue)$': 'vue-jest'\r\n },\r\n collectCoverage: true,\r\n transformIgnorePatterns: [\r\n 'node_modules/(?!(nuxt-i18n)/)',\r\n 'node_modules/(?!(nuxt-webfontloader)/)',\r\n 'node_modules/(?!(nuxt-test-utils)/)'\r\n ],\r\n testEnvironment: 'jsdom',\r\n preset: '@nuxt/test-utils'\r\n}\r\n\r\n\r\n```\r\nThis is my package.json:\r\n```\r\n \"dependencies\": {\r\n \"@adyen/adyen-web\": \"^4.2.3\",\r\n \"@bugsnag/js\": \"^7.1.1\",\r\n \"@bugsnag/plugin-vue\": \"^7.1.1\",\r\n \"@nuxtjs/axios\": \"^5.3.6\",\r\n \"@nuxtjs/dayjs\": \"^1.3.0\",\r\n \"@nuxtjs/gtm\": \"^2.3.2\",\r\n \"@nuxtjs/pwa\": \"^3.3.5\",\r\n \"@nuxtjs/router\": \"^1.5.0\",\r\n \"@nuxtjs/svg-sprite\": \"^0.4.10\",\r\n \"@tailwindcss/aspect-ratio\": \"^0.2.0\",\r\n \"@tailwindcss/forms\": \"^0.3.2\",\r\n \"@tailwindcss/typography\": \"^0.4.0\",\r\n \"cookie-universal-nuxt\": \"^2.1.4\",\r\n \"core-js\": \"^2.6.0\",\r\n \"cross-env\": \"^5.2.0\",\r\n \"dotenv\": \"^8.2.0\",\r\n \"eslint-loader\": \"^4.0.2\",\r\n \"express\": \"^4.16.4\",\r\n \"jsdom\": \"^16.4.0\",\r\n \"lozad\": \"^1.15.0\",\r\n \"node-fetch\": \"^2.6.1\",\r\n \"nuxt\": \"2.15.4\",\r\n \"nuxt-feature-toggle\": \"^1.0.1\",\r\n \"nuxt-font-loader-strategy\": \"^1.1.1\",\r\n \"nuxt-i18n\": \"^6.15.4\",\r\n \"nuxt-jsonld\": \"^1.4.10\",\r\n \"nuxt-webfontloader\": \"^1.1.0\",\r\n \"v-click-outside\": \"^3.0.1\",\r\n \"v-clipboard\": \"^2.2.3\",\r\n \"vue-debounce\": \"^2.5.6\",\r\n \"vue-glide-js\": \"^1.3.14\",\r\n \"vue-gtm\": \"^2.3.1\",\r\n \"vue-slider-component\": \"^3.1.4\",\r\n \"vue-social-sharing\": \"^3.0.0-beta.11\",\r\n \"vue-toastification\": \"^1.7.6\",\r\n \"vue-vimeo-player\": \"^0.1.0\",\r\n \"vuelidate\": \"^0.7.5\"\r\n },\r\n \"devDependencies\": {\r\n \"@babel/core\": \"^7.7.7\",\r\n \"@babel/preset-env\": \"^7.15.0\",\r\n \"@babel/plugin-transform-runtime\": \"^7.15.0\",\r\n \"@nuxt/test-utils\": \"^0.2.2\",\r\n \"@nuxtjs/eslint-config\": \"^5.0.0\",\r\n \"@nuxtjs/eslint-module\": \"^3.0.1\",\r\n \"@nuxtjs/tailwindcss\": \"^4.1.2\",\r\n \"@testing-library/vue\": \"^5.8.2\",\r\n \"@vue/test-utils\": \"^1.1.2\",\r\n \"babel-eslint\": \"^10.0.1\",\r\n \"babel-jest\": \"26\",\r\n \"eslint\": \"^7.14.0\",\r\n \"eslint-config-prettier\": \"^6.15.0\",\r\n \"eslint-plugin-nuxt\": \"^2.0.0\",\r\n \"eslint-plugin-prettier\": \"^3.1.4\",\r\n \"jest\": \"26\",\r\n \"node-sass\": \"^4.14.1\",\r\n \"nodemon\": \"^1.18.9\",\r\n \"playwright\": \"^1.14.1\",\r\n \"postcss\": \"^8.2.9\",\r\n \"prettier\": \"^1.19.1\",\r\n \"sass-loader\": \"10.1.1\",\r\n \"vue-jest\": \"^4.0.0-rc.1\"\r\n }\r\n}\r\n```\r\n\r\n\r\nMy .babelrc: \r\n```\r\n{\r\n \"env\": {\r\n \"test\": {\r\n \"presets\": [\r\n [\r\n \"@babel/preset-env\",\r\n {\r\n \"targets\": {\r\n \"node\": \"current\"\r\n }\r\n }\r\n ]\r\n ]\r\n }\r\n }\r\n}\r\n```\r\n\r\n\r\nI am trying to use this test: \r\n\r\n`import { createPage, setupTest } from '@nuxt/test-utils'`\r\n\r\n`describe('browser', () => {`\r\n `setupTest({ browser: true })`\r\n\r\n ` it('renders the index page', async () => {`\r\n ` const page = await createPage('/')`\r\n ` const html = await page.innerHTML('body')`\r\n\r\n ` expect(html).toContain('Something')`\r\n` })`\r\n`})`\r\n\r\n",[2890],{"name":2891,"color":2892},"v0","4137F6",320,"\"Cannot use import statement outside a module\" when i use setupTest","2024-05-23T20:19:27Z","https://github.com/nuxt/test-utils/issues/320",0.565265,{"description":2899,"labels":2900,"number":2904,"owner":2857,"repository":2871,"state":2879,"title":2905,"updated_at":2906,"url":2907,"score":2908},"Hey guys, today I upgraded `vitest` and `nuxt-vitest` to version [0.29.2](https://github.com/vitest-dev/vitest/releases/tag/v0.29.2) and [0.6.8](https://github.com/danielroe/nuxt-vitest/releases/tag/0.6.8), respectively.\r\n\r\nI upgraded `nuxt-vitest` because I upgraded `vitest` and installed `c8` for test coverage and I started getting the following error message on test runs:\r\n```\r\nError: Cannot find module 'vitest-environment-nuxt/module'\r\n```\r\n\r\nAnd after the `nuxt-vitest` upgrade, I started getting the following error:\r\n```\r\nError: Cannot find import \"useI18n\" to mock\r\n```\r\n\r\nAnd this happens when I try to mock `useI18n` (from `@nuxtjs/i18n`), which exists globally in my application:\r\n```javascript\r\nimport { mockNuxtImport } from 'nuxt-vitest/utils'\r\n\r\nmockNuxtImport('useI18n', () => {\r\n return () => {\r\n return {\r\n t: vi.fn()\r\n }\r\n }\r\n})\r\n```\r\n\r\nBefore all these upgrades, the mock was working properly.\r\nAnyone else with a similar problem?\r\n\r\n*EXTRA INFORMATION*\r\nOn the other hand...\r\nMy original approach to mock i18n started to work (didn't work before):\r\n```javascript\r\nimport { useI18n } from 'vue-i18n'\r\nimport { vi } from 'vitest'\r\n\r\nvi.mock('vue-i18n')\r\n\r\nuseI18n.mockReturnValue({\r\n t: (tKey) => tKey\r\n})\r\n```\r\nAnd I using this approach for now. And why it didn't work before is a mystery...",[2901],{"name":2902,"color":2903},"vitest-environment","b60205",508,"`mockNuxtImport` failing to mock Nuxt auto imports","2023-12-02T00:22:09Z","https://github.com/nuxt/test-utils/issues/508",0.63328356,{"description":2910,"labels":2911,"number":2913,"owner":2857,"repository":2871,"state":2879,"title":2914,"updated_at":2915,"url":2916,"score":2917},"Try running `yarn test` in https://codesandbox.io/s/optimistic-maxwell-l1dmx?file=/tests/test.spec.js",[2912],{"name":2891,"color":2892},283,"\"Cannot use import statement outside a module\" while using with nuxt-i18n","2024-05-01T16:05:10Z","https://github.com/nuxt/test-utils/issues/283",0.6378602,{"description":2919,"labels":2920,"number":2921,"owner":2857,"repository":2871,"state":2879,"title":2922,"updated_at":2923,"url":2924,"score":2925},"Hi,\r\n\r\nI was trying to integrate @nuxt/test-utils in my Nuxt application in order to test pages.\r\nI already have a bunch of tests written for the components that use @vue/test-utils.\r\n\r\nAfter following the documentation and adding the `@nuxt/test-utils` preset to my jest configuration, all my components tests started failing with the same error:\r\n\r\n```shell\r\n[vue-test-utils]: window is undefined, vue-test-utils needs to be run in a browser environment. \r\n You can run the tests in node using jsdom \r\n See https://vue-test-utils.vuejs.org/guides/#browser-environment for more details.\r\n```\r\n\r\nAny idea how to solve this and be able to use both tools within the same project ?\r\n\r\nThanks!",[],327,"Conflict between @nuxt/test-utils jest preset and @vue/test-utils","2023-12-02T00:23:10Z","https://github.com/nuxt/test-utils/issues/327",0.64703643,{"description":2927,"labels":2928,"number":2929,"owner":2857,"repository":2871,"state":2879,"title":2930,"updated_at":2931,"url":2932,"score":2933},"Trying to get the test-utils to work, but after adding the preset, JEST simply won't run, saying that the test utils cannot be found.\r\n\r\nThis is straight from the docs. I've tried a bunch of different versions, and simply cannot get them to work. This is required (I think) in order to get the global function calls (such as definePageMeta) to work in tests.\r\n\r\n> ● Validation Error:\r\n>\r\n> Preset @nuxt/test-utils not found.\r\n>\r\n> Configuration Documentation:\r\n> https://jestjs.io/docs/configuration.html\r\n\r\nThe test utils are installed.\r\n\r\nAny ideas?",[],280,"Preset @nuxt/test-utils not found.","2023-12-02T00:18:11Z","https://github.com/nuxt/test-utils/issues/280",0.6539456,{"description":2935,"labels":2936,"number":2938,"owner":2857,"repository":2871,"state":2879,"title":2939,"updated_at":2940,"url":2941,"score":2942},"### Environment\r\n\r\n- Operating System: `Linux`\r\n- Node Version: `v16.14.2`\r\n- Nuxt Version: `3.0.0-rc.8`\r\n- Package Manager: `npm@7.17.0`\r\n- Builder: `vite`\r\n- User Config: `modules`\r\n- Runtime Modules: `vite-plugin-vue-type-imports/nuxt`\r\n- Build Modules: `-`\r\n\r\n### Reproduction\r\n\r\n#### How to recreate\r\n\r\nFor every link:\r\n\r\n1. Open a link.\r\n2. Wait for a development server is start and the Nuxt Welcome page is loaded.\r\n4. Press \u003Ckbd>Ctrl\u003C/kbd> + \u003Ckbd>C\u003C/kbd> in Terminal.\r\n5. Run `npm test`.\r\n\r\n#### Broken\r\n\r\nhttps://stackblitz.com/edit/github-owtwqh-82agcd?file=nuxt.config.ts,modules%2Fvite-plugin-vue-type-imports.ts,app.vue\r\n\r\n##### Load a bundled Nuxt module from the `node_modules` directory\r\n\r\n```ts\r\nexport default defineNuxtConfig({\r\n modules: [\r\n 'vite-plugin-vue-type-imports/nuxt',\r\n ],\r\n});\r\n```\r\n\r\n#### Working\r\n\r\nhttps://stackblitz.com/edit/github-owtwqh-dyj8f8?file=nuxt.config.ts,modules%2Fvite-plugin-vue-type-imports.ts,app.vue\r\n\r\n##### Load a local Nuxt module from the `modules/` directory\r\n\r\n```ts\r\nexport default defineNuxtConfig({\r\n modules: [\r\n '~/modules/vite-plugin-vue-type-imports.ts',\r\n ],\r\n});\r\n```\r\n\r\n### Describe the bug\r\n\r\nThe `vite-plugin-vue-type-imports/nuxt` module added in `nuxt.config.ts` is:\r\n\r\n* works when loaded via `npm run dev`;\r\n* broken if loaded via `npm test` (`nuxt test` or `vitest` with `@nuxt/test-utils-edge`).\r\n\r\n### Additional context\r\n\r\nThe [same Nuxt module code](https://github.com/wheatjs/vite-plugin-vue-type-imports/blob/370fcea9c7a09a0961bdf6e29b0795963034eb1e/src/nuxt.ts) is works with `npm test` if copy-pasted and loaded as a local plugin from the `modules/` directory.\r\n\r\n### Logs\r\n\r\n```shell\r\nERROR TypeError: Invalid URL 22:18:50\r\n\r\n ❯ TypeError.get https:/github-owtwqh-82agcd.w.staticblitz.com/blitz.df64f655701fde45529fa8e152b3842072335b47.js:6:292488\r\n 22:18:50\r\n⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯\r\nSerialized Error: { 22:18:50\r\n \"code\": \"ERR_INVALID_URL\",\r\n \"input\": \"//\",\r\n}\r\n```\r\n",[2937],{"name":2868,"color":2869},345,"Vitest with `@nuxt/test-utils-edge` breaks imported `vite-plugin-vue-type-imports/nuxt` module, but works if same module code is recreated locally","2023-12-02T00:33:10Z","https://github.com/nuxt/test-utils/issues/345",0.6572627,["Reactive",2944],{},["Set"],["ShallowReactive",2947],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f05CHJMeikXFg_XZbD1C8gQDCjPJdkl_BjMrsNUyJERU":-1},"/nuxt/test-utils/267"]