Help in migration to Nuxt 4, error in testing part
Hi, I havent found what is the correct architrcture for test folder and what would have changed in v4. After updating folder architacture the test completely fails with this error
No test files found. You can change the file name pattern by pressing "p"
include: /*.{test,spec}.?(c|m)[jt]s?(x)
exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, /{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.*
38 Replies
Hi @eleonorazhyrlitsyna. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
When migrating to Nuxt 4, the default directory structure and the way tests are organized have changed. This can affect how your test runner (like Vitest) discovers test files, which is likely the cause of your "No test files found" error.
New Recommended Test Folder Structure
With Nuxt 4, it is recommended to organize your tests using a project-based structure, typically like this:
- unit/: For pure unit tests (Node environment).
- nuxt/: For tests that require the Nuxt runtime environment.
- e2e/: For end-to-end tests.
This separation is important for test stability, as different environments are used for different types of tests. The Nuxt docs provide more details and examples for this structure here.
Vitest Configuration Example
Your
Your error is likely due to test files not being in the expected locations or your Vitest config not matching the new Nuxt 4 structure. Update both according to the guidance above and your tests should be discovered and run correctly. Source: Nuxt 4 Testing Docs ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
vitest.config.ts
should be updated to match the new structure. Here’s an example from the docs:
This configuration ensures that Vitest looks for test files in the correct subfolders and runs them in the appropriate environment. If your test files are not in these locations or your config does not match, Vitest will not find them and you'll see the error you described.
Migration Steps
1. Move your test files into the recommended test/nuxt/
, test/unit/
, and test/e2e/
folders.
2. Update your vitest.config.ts
to match the new structure and include patterns.
3. Run your tests using npx vitest
or the appropriate script.
If you want all tests to run in the Nuxt environment, you can use a simpler config, but the project-based approach is recommended for clarity and stability.
For more details, see the official Nuxt 4 testing documentation: Testing in Nuxt 4.
---
Summary:Your error is likely due to test files not being in the expected locations or your Vitest config not matching the new Nuxt 4 structure. Update both according to the guidance above and your tests should be discovered and run correctly. Source: Nuxt 4 Testing Docs ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai The test folder should be in root directory?
@kapa.ai what versions of packages should be for these updates?
Let me check the knowledge base for you again. One moment! :books:
----------------------
For migrating to Nuxt 4 and updating your testing setup, the recommended package versions based on the official documentation and recent PRs are:
- nuxt:
(Install with:
Upgrade Guide - @nuxt/test-utils: Use the latest available version for Nuxt 4. As of the most recent updates, versions like
PR using v3.19.x
Recent update to v3.19.2 - vitest: No specific version is mandated in the docs, but compatibility with the latest
(Install with:
Testing Docs - @vue/test-utils: No specific version is mentioned, but it should be compatible with Vue 3 and Nuxt 4.
(Install with:
Testing Docs - happy-dom or jsdom: Either can be used for the runtime environment.
(Install with:
Testing Docs - playwright-core: Only if you need browser testing utilities.
(Install with:
Testing Docs Summary Table: | Package | Recommended Version Example | |-----------------------|----------------------------| | nuxt | ^4.0.0 | | @nuxt/test-utils | ^3.19.2 | | vitest | latest | | @vue/test-utils | latest | | happy-dom / jsdom | latest | | playwright-core | latest (if needed) | If you want to ensure compatibility with the latest Nuxt 4 features and testing improvements, use the most recent versions of these packages as shown above. If you encounter issues, check the Nuxt 4 upgrade guide and the testing documentation for updates and troubleshooting steps. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
^4.0.0
(Install with:
npm install nuxt@^4.0.0
)Upgrade Guide - @nuxt/test-utils: Use the latest available version for Nuxt 4. As of the most recent updates, versions like
3.19.x
are referenced, and features such as Vitest workspaces are supported from v3.19.0
onward.PR using v3.19.x
Recent update to v3.19.2 - vitest: No specific version is mandated in the docs, but compatibility with the latest
@nuxt/test-utils
(3.18.x and above) and Nuxt 4 is expected.(Install with:
npm i --save-dev vitest
)Testing Docs - @vue/test-utils: No specific version is mentioned, but it should be compatible with Vue 3 and Nuxt 4.
(Install with:
npm i --save-dev @vue/test-utils
)Testing Docs - happy-dom or jsdom: Either can be used for the runtime environment.
(Install with:
npm i --save-dev happy-dom
)Testing Docs - playwright-core: Only if you need browser testing utilities.
(Install with:
npm i --save-dev playwright-core
)Testing Docs Summary Table: | Package | Recommended Version Example | |-----------------------|----------------------------| | nuxt | ^4.0.0 | | @nuxt/test-utils | ^3.19.2 | | vitest | latest | | @vue/test-utils | latest | | happy-dom / jsdom | latest | | playwright-core | latest (if needed) | If you want to ensure compatibility with the latest Nuxt 4 features and testing improvements, use the most recent versions of these packages as shown above. If you encounter issues, check the Nuxt 4 upgrade guide and the testing documentation for updates and troubleshooting steps. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai What can cause this error after updating config and architecture folder
3| import ExportMenu from '~/components/exportMenu.vue'
| ^
4| import InIcon from '~/components/in/icon.vue'
5|
Caused by: Error: Failed to load url ~/components/exportMenu.vue (resolved id: ~/components/exportMenu.vue) in /usr/src/app/test/nuxt/components/exportMenu.test.js. Does the file exist?
Let me check the knowledge base for you again. One moment! :books:
----------------------
The error
is most likely caused by changes in the Nuxt 4 directory structure and how the
Ensure
Use
If you have a custom alias or changed the default, verify your
If your test runner is running from a different context or root, make sure it is aware of Nuxt's alias resolution. Summary This error is almost always due to the new Nuxt 4 directory structure and the change in what
is most likely caused by changes in the Nuxt 4 directory structure and how the
~
alias is resolved.
Key Points from the Knowledge Sources
- In Nuxt 4, the ~
alias now points to the app/
directory by default (your srcDir
). So ~/components
resolves to app/components/
, not the project root anymore. If your components
directory is not inside app/
, the alias will not resolve correctly and you'll get a "Does the file exist?" error New Directory Structure.
- Your import should be:
if and only if the file is at app/components/exportMenu.vue
in your project.
- If you moved your components
directory but did not update the alias or folder location, the import will fail.
- Double-check that the file exists at the correct path relative to the new app/
directory.
What to Check
1. File Location:Ensure
exportMenu.vue
is at app/components/exportMenu.vue
(not at the project root or elsewhere).
2. Import Path:Use
~/components/exportMenu.vue
only if the file is in app/components/
.
3. Alias Configuration:If you have a custom alias or changed the default, verify your
nuxt.config.ts
alias settings Nuxt Config Aliases.
4. Test Runner Context:If your test runner is running from a different context or root, make sure it is aware of Nuxt's alias resolution. Summary This error is almost always due to the new Nuxt 4 directory structure and the change in what
~
points to. Move your components
folder into app/
and the import should work as expected New Directory Structure.
If you need to keep a different structure, adjust your alias in nuxt.config.ts
accordingly Nuxt Config Aliases.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai the relative path of component is app/components/exportMenu.vue
Let me check the knowledge base for you again. One moment! :books:
----------------------
Given that your component is located at
If you are running tests outside the Nuxt runtime environment (e.g., using plain Vitest or @vue/test-utils without Nuxt integration), the
Make sure your test files are in the correct directory (e.g.,
Nuxt and some file systems are case-sensitive. Ensure the file is named exactly
If your file is at
app/components/exportMenu.vue
, and you are using the import:
this should be correct in Nuxt 4, because the ~
alias now points to the app/
directory by default. So ~/components/exportMenu.vue
resolves to app/components/exportMenu.vue
New Directory Structure.
If you are still seeing the error:
then possible causes include:
1. Test Runner Not Using Nuxt Context:If you are running tests outside the Nuxt runtime environment (e.g., using plain Vitest or @vue/test-utils without Nuxt integration), the
~
alias will not be recognized. You must use the Nuxt test environment as described in the docs, which ensures aliases are resolved properly Unit Testing.
2. Incorrect Test File Location or Configuration:Make sure your test files are in the correct directory (e.g.,
test/nuxt/
) and your vitest.config.ts
is set up to use the Nuxt environment for those tests. This is necessary for Nuxt-specific features like auto-imports and aliases to work Unit Testing.
3. File Name Casing:Nuxt and some file systems are case-sensitive. Ensure the file is named exactly
exportMenu.vue
and not, for example, ExportMenu.vue
.
Summary:If your file is at
app/components/exportMenu.vue
and you use ~/components/exportMenu.vue
, this is correct for Nuxt 4. If you still get the error, ensure your tests are running in the Nuxt environment so that the ~
alias is recognized Unit Testing. If you are using plain Vitest or @vue/test-utils without Nuxt, the alias will not work.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai My file file is at app/components/exportMenu.vue and you use ~/components/exportMenu.vue and I still hasve error
Let me check the knowledge base for you again. One moment! :books:
----------------------
If your file is at
Ensure your test is in the
Run your tests using
Double-check that the file name matches exactly, as file systems can be case-sensitive. If you have confirmed all of the above and the error persists, the knowledge sources do not provide further troubleshooting steps for this specific scenario. The most common cause, according to the documentation, is not using the Nuxt test environment, which is required for Nuxt-specific aliases like
app/components/exportMenu.vue
and you are importing it with:
this is the correct usage in Nuxt 4, as the ~
alias points to the app/
directory by default Nuxt Config Aliases.
However, if you are still seeing the error:
the most likely cause, based on the knowledge sources, is that your test is not running in the Nuxt environment, so the ~
alias is not being resolved. The Nuxt documentation states that for tests to recognize Nuxt aliases, you must use the Nuxt test environment provided by @nuxt/test-utils
and configure your vitest.config.ts
accordingly Unit Testing.
What to check:
1. Test Environment:Ensure your test is in the
test/nuxt/
directory and your vitest.config.ts
includes a project with environment: 'nuxt'
for that directory. Example:
Unit Testing
2. Running Tests:Run your tests using
npx vitest
or the script defined in your package.json
to ensure the Nuxt environment is used Running Tests.
3. File Name Casing:Double-check that the file name matches exactly, as file systems can be case-sensitive. If you have confirmed all of the above and the error persists, the knowledge sources do not provide further troubleshooting steps for this specific scenario. The most common cause, according to the documentation, is not using the Nuxt test environment, which is required for Nuxt-specific aliases like
~
to work in tests.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai
import { defineConfig } from 'vitest/config'
import { defineVitestProject } from '@nuxt/test-utils/config'
export default defineConfig({
test: {
projects: [
{
test: {
name: 'unit',
include: ['test/{e2e,unit}/.{test,spec}.ts'],
environment: 'node',
},
},
await defineVitestProject({
test: {
environment: 'nuxt',
include: ['test/nuxt/.{test,spec}.js'],
globals: true,
globalSetup: 'test/nuxt/test-globals.ts',
setupFiles: ['test/nuxt/setup.ts'],
},
}),
],
},
})
testa in test/nuxt/.. directory, components in app/components/..
I've got error
No test files found. You can change the file name pattern by pressing "p"
unit
include: test/{e2e,unit}/.{test,spec}.ts exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config. 1
include: test/nuxt/.{test,spec}.js exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.
include: test/{e2e,unit}/.{test,spec}.ts exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config. 1
include: test/nuxt/.{test,spec}.js exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.
Let me check the knowledge base for you again. One moment! :books:
----------------------
Your error is caused by the
Your pattern for the unit project is: This pattern is missing a
Your Nuxt project pattern is: This will only match
The Nuxt docs show the correct pattern as: and for unit/e2e: See: Unit Testing How to fix your config: Summary:
Update your
include
pattern in your Vitest config not matching your test files.
Key issues:
1. Pattern Typo in Unit Project:Your pattern for the unit project is: This pattern is missing a
*
before .{test,spec}.ts
, so it will not match any files. It should be:
2. File Extension Mismatch in Nuxt Project:Your Nuxt project pattern is: This will only match
.js
test files. If your tests are .ts
files, you need:
Or, if you only use .ts
:
What the knowledge sources say:The Nuxt docs show the correct pattern as: and for unit/e2e: See: Unit Testing How to fix your config: Summary:
Update your
include
patterns to match your actual test file extensions and use the correct glob pattern. This should resolve the "No test files found" error as described in the Nuxt documentation Unit Testing.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai
import { defineConfig } from 'vitest/config'
import { defineVitestProject } from '@nuxt/test-utils/config'
export default defineConfig({
test: {
projects: [
// {
// test: {
// name: 'unit',
// include: ['test/{e2e,unit}/.{test,spec}.ts'],
// environment: 'node',
// },
// },
await defineVitestProject({
test: {
environment: 'nuxt',
include: ['test/nuxt/*.{test,spec}.{js,ts}'],
globals: true,
globalSetup: 'test/nuxt/test-globals.ts',
setupFiles: ['test/nuxt/setup.ts'],
},
}),
],
},
})
in test i have only nuxt folder, without e2e ant unit
Let me check the knowledge base for you again. One moment! :books:
----------------------
Your configuration is almost correct for a project that only has a
Your configuration is correct for a project with only a
test/nuxt/
folder and no e2e
or unit
folders. According to the Nuxt 4 documentation, your include
pattern should match the test files you have in test/nuxt/
. The pattern you are using:
will match files like test/nuxt/example.test.js
, test/nuxt/example.spec.ts
, etc., which is correct if your test files follow this naming convention.
Key points from the knowledge sources:
- The recommended structure is to separate tests into unit
, nuxt
, and e2e
folders, but it is not required. You can have only a nuxt
folder if you only need Nuxt runtime environment tests Unit Testing.
- The include
pattern should match your actual test file names and extensions. The pattern you use is valid for both .js
and .ts
files with .test
or .spec
in their names.
- You do not need to define the unit
or e2e
projects if you do not have those folders or tests.
Summary:Your configuration is correct for a project with only a
test/nuxt/
folder. Just ensure your test files are named like *.test.js
, *.spec.ts
, etc., and are located in test/nuxt/
. If you follow this, Vitest with Nuxt will discover and run your tests as expected Unit Testing.
If you still encounter issues, double-check your file naming and paths, as the test runner will only find files that match the include
pattern.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai still have error
DEV v3.2.4 /usr/src/app
No test files found. You can change the file name pattern by pressing "p"
0
include: test/nuxt/.{test,spec}.{js,ts} exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.
include: test/nuxt/.{test,spec}.{js,ts} exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.
Let me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, if you are still seeing the error:
Possible causes according to the Nuxt documentation:
1. File Naming or Location:
The
- If your test files are in subfolders (e.g.,
- If your test files do not have
If your tests are in subfolders, update your pattern to: This will match test files in all subdirectories, as shown in the Nuxt docs for organizing tests Unit Testing. 3. File Extensions:
Make sure your test files have the correct extensions (
The most likely reason for "No test files found" is that your
The
include
pattern test/nuxt/*.{test,spec}.{js,ts}
will only match files directly inside test/nuxt/
named like something.test.js
, something.spec.ts
, etc.- If your test files are in subfolders (e.g.,
test/nuxt/components/example.test.ts
), they will not be matched.- If your test files do not have
.test.js
, .spec.ts
, etc., in their names, they will not be matched.
2. Pattern Should Match Your Structure:If your tests are in subfolders, update your pattern to: This will match test files in all subdirectories, as shown in the Nuxt docs for organizing tests Unit Testing. 3. File Extensions:
Make sure your test files have the correct extensions (
.js
or .ts
) and naming (.test
or .spec
).
Example:
If your test file is at test/nuxt/components/exportMenu.test.ts
, your config should be:
Summary:The most likely reason for "No test files found" is that your
include
pattern does not match the actual location or naming of your test files. Adjust the pattern as above to match files in subfolders if needed. This is directly supported by the Nuxt documentation Unit Testing.
If you have confirmed your files match the pattern and are still having issues, the knowledge sources do not provide further troubleshooting steps for this specific scenario.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai
No test files found. You can change the file name pattern by pressing "p"
0
include: test/nuxt//*.{test,spec}.{js,ts} exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, /{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.* ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Error ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Error: Cannot find module '/@fs//usr/src/app/app/test/nuxt/test-globals.ts' ❯ ViteNodeRunner._fetchModule node_modules/vite-node/dist/client.mjs:247:19 ❯ ViteNodeRunner.directRequest node_modules/vite-node/dist/client.mjs:268:44 ❯ ViteNodeRunner.cachedRequest node_modules/vite-node/dist/client.mjs:189:11 ❯ ViteNodeRunner.executeFile node_modules/vite-node/dist/client.mjs:162:10 ❯ loadGlobalSetupFile node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:5798:12 ❯ TestProject._initializeGlobalSetup node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:7072:24 ❯ Vitest.initializeGlobalSetup node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9724:35 ❯ node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9636:5 ❯ Vitest.runFiles node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9666:10 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Serialized Error: { code: 'ERR_MODULE_NOT_FOUND' } Caused by: Error: Failed to load url /usr/src/app/app/test/nuxt/test-globals.ts (resolved id: /usr/src/app/app/test/nuxt/test-globals.ts). Does the file exist? ❯ loadAndTransform node_modules/vite/dist/node/chunks/dep-Bj7gA1-0.js:26300:33 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Serialized Error: { code: 'ERR_LOAD_URL' }
include: test/nuxt//*.{test,spec}.{js,ts} exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, /{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.* ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Error ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Error: Cannot find module '/@fs//usr/src/app/app/test/nuxt/test-globals.ts' ❯ ViteNodeRunner._fetchModule node_modules/vite-node/dist/client.mjs:247:19 ❯ ViteNodeRunner.directRequest node_modules/vite-node/dist/client.mjs:268:44 ❯ ViteNodeRunner.cachedRequest node_modules/vite-node/dist/client.mjs:189:11 ❯ ViteNodeRunner.executeFile node_modules/vite-node/dist/client.mjs:162:10 ❯ loadGlobalSetupFile node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:5798:12 ❯ TestProject._initializeGlobalSetup node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:7072:24 ❯ Vitest.initializeGlobalSetup node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9724:35 ❯ node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9636:5 ❯ Vitest.runFiles node_modules/vitest/dist/chunks/cli-api.BkDphVBG.js:9666:10 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Serialized Error: { code: 'ERR_MODULE_NOT_FOUND' } Caused by: Error: Failed to load url /usr/src/app/app/test/nuxt/test-globals.ts (resolved id: /usr/src/app/app/test/nuxt/test-globals.ts). Does the file exist? ❯ loadAndTransform node_modules/vite/dist/node/chunks/dep-Bj7gA1-0.js:26300:33 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Serialized Error: { code: 'ERR_LOAD_URL' }
Let me check the knowledge base for you again. One moment! :books:
----------------------
Your error message indicates two main issues:
1. No test files found
The pattern you are using,
- Double-check that your test files are named with
The error shows that Vitest is looking for
Ensure you have files like
Make sure these files exist at the specified locations and are referenced with the correct relative path (not using
The pattern you are using,
test/nuxt/**/*.{test,spec}.{js,ts}
, is correct for matching files like test/nuxt/someTest.test.ts
or test/nuxt/dir/anotherTest.spec.js
. If you still see "No test files found," it means there are no files matching this pattern in your project.- Double-check that your test files are named with
.test.js
, .spec.ts
, etc., and are located somewhere under test/nuxt/
.
2. Cannot find module '/usr/src/app/app/test/nuxt/test-globals.ts'The error shows that Vitest is looking for
test/nuxt/test-globals.ts
inside /usr/src/app/app/
, not /usr/src/app/
. This suggests your project root is /usr/src/app
, but something (likely Nuxt's new directory structure) is causing the test runner to look inside an extra app/
directory.
According to the Nuxt 4 documentation, the ~
alias now points to the app/
directory, but your test files and setup files should be referenced relative to the project root, not using the ~
alias in the config. If your test/nuxt/test-globals.ts
file is at /usr/src/app/test/nuxt/test-globals.ts
, make sure your config references it as 'test/nuxt/test-globals.ts'
.
If you see /usr/src/app/app/test/nuxt/test-globals.ts
in the error, but your file is actually at /usr/src/app/test/nuxt/test-globals.ts
, this means the path is being resolved incorrectly.
---
What to do
- Check your test file locations and names:Ensure you have files like
test/nuxt/example.test.ts
or test/nuxt/example.spec.js
.
- Check your global setup and setupFiles paths:Make sure these files exist at the specified locations and are referenced with the correct relative path (not using
~
).
- If your project root is /usr/src/app
, your test files should be at /usr/src/app/test/nuxt/
, and your config should reference them as 'test/nuxt/test-globals.ts'
and 'test/nuxt/setup.ts'
.
---
If you have confirmed all of the above and the error persists, the knowledge sources do not provide further troubleshooting steps for this specific scenario. The most likely cause, according to the documentation, is a mismatch between the expected and actual file locations or naming, or incorrect path references in your config Unit Testing.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai
import { defineConfig } from 'vitest/config'
import { defineVitestProject } from '@nuxt/test-utils/config'
export default defineConfig({
test: {
projects: [
await defineVitestProject({
test: {
environment: 'nuxt',
include: ['test/nuxt//*.{test,spec}.{js,ts}'],
globals: true,
globalSetup: 'test/nuxt/test-globals.ts',
setupFiles: ['test/nuxt/setup.ts'],
},
}),
],
},
})
No test files found. You can change the file name pattern by pressing "p"
include: test/nuxt//.{test,spec}.{js,ts}
exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, **/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.
file:///usr/src/app/node_modules/vite-node/dist/client.mjs:247
const error = new Error(
Cannot find ${isBareImport(id) ? "package" : "module"} '${id}'${importer ?
imported from '${importer}' : ""}
, { cause });
^
Error: Cannot find module '/@fs//usr/src/app/app/test/nuxt/test-globals.ts'
at ViteNodeRunner._fetchModule (file:///usr/src/app/node_modules/vite-node/dist/client.mjs:247:19)
}
test in root/test/nuxt
components in root/app/componentsLet me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, your configuration and file structure should work if:
- Your test files are in
Make sure you are running Vitest from the project root (
Your
Ensure you do not have an
Your config should use: and these files must exist at those exact locations. 5. Check your test file names and locations:
Your pattern
root/test/nuxt/
and named like something.test.ts
or something.spec.js
.
- Your globalSetup
and setupFiles
are referenced as 'test/nuxt/test-globals.ts'
and 'test/nuxt/setup.ts'
and these files exist at those paths.
However, your error message shows:
This means Vitest is looking for test/nuxt/test-globals.ts
inside an extra app/
directory (/usr/src/app/app/test/nuxt/test-globals.ts
), but your actual file is at /usr/src/app/test/nuxt/test-globals.ts
.
What the knowledge sources indicate
- In Nuxt 4, the ~
alias points to the app/
directory, but for test setup files in your config, you should use a path relative to the project root, not using the ~
alias Unit Testing.
- There is no mention in the knowledge sources of Nuxt or Vitest automatically prepending app/
to the path for setup files. This suggests a possible misconfiguration or an environment issue.
What to check
1. Check your working directory:Make sure you are running Vitest from the project root (
/usr/src/app
), not from inside the app/
directory.
2. Check your config file location:Your
vitest.config.ts
should be in the project root, not inside app/
.
3. Check for duplicate app/
directories:Ensure you do not have an
app/
directory inside another app/
directory by mistake.
4. Check your import paths:Your config should use: and these files must exist at those exact locations. 5. Check your test file names and locations:
Your pattern
test/nuxt/**/*.{test,spec}.{js,ts}
will only match files like test/nuxt/foo.test.ts
or test/nuxt/bar/baz.spec.js
. If your files do not match this pattern, they will not be found Unit Testing.
If the problem persists
The knowledge sources do not provide further troubleshooting steps for this specific scenario. The most likely cause, according to the documentation, is a mismatch between the expected and actual file locations or naming, or incorrect path references in your config.
If you have confirmed all of the above and the error persists, you may need to review your project structure and ensure there are no path or directory issues as described above.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai OK.Another case
I updated project to version nuxt 4+. And I didn't changed anything, only updated, while i run test I have got
DEV v3.2.4 /usr/src/app/app
No test files found. You can change the file name pattern by pressing "p"
include: /*.{test,spec}.?(c|m)[jt]s?(x)
exclude: /node_modules/, /dist/, /cypress/, /.{idea,git,cache,output,temp}/, /{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build,eslint,prettier}.config.*
Error: Cannot find module '/@fs//usr/src/app/app/test
Let me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, after upgrading to Nuxt 4+, the default directory structure and how paths are resolved have changed significantly. In Nuxt 4, the
Make sure you are running your test commands from the project root, not from inside
If you want to keep your old structure, add this to your
Ensure your test files are in the correct location and match the
srcDir
now defaults to app/
, and the ~
alias points to this app/
directory, not the project root. This can affect how your test runner locates files and resolves paths New Directory Structure.
Key points from the knowledge sources:
- If you did not change your folder structure after upgrading, Nuxt may now be running with app/
as the root for source files, and your test runner may be running from /usr/src/app/app
instead of /usr/src/app
.
- The error message and the fact that your working directory is /usr/src/app/app
suggest that Nuxt is treating app/
as the root, which may cause test files outside app/
(such as test/
) not to be found.
- The test runner’s include
pattern is looking for test files relative to the current working directory. If your tests are in /usr/src/app/test/
, but the runner is in /usr/src/app/app
, it will not find them.
What the documentation recommends:
- After upgrading, you should move your source folders (components/
, pages/
, etc.) into app/
, but keep your test/
folder at the project root, not inside app/
.
- If you want to keep your old structure, you can set srcDir: '.'
in your nuxt.config.ts
to revert to the previous behavior New Directory Structure.
How to resolve:
1. Check your working directory:Make sure you are running your test commands from the project root, not from inside
app/
.
2. Check your srcDir
setting:If you want to keep your old structure, add this to your
nuxt.config.ts
:
This will revert the srcDir
to the project root, so your test runner will look for files in the correct place.
3. Check your test file locations:Ensure your test files are in the correct location and match the
include
pattern.
If you follow these steps, your test runner should be able to find your test files after upgrading to Nuxt 4 New Directory Structure.
If you still encounter issues, the knowledge sources do not provide further troubleshooting steps for this specific scenario.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.aishould be in vitest config the same settings?
Let me check the knowledge base for you again. One moment! :books:
----------------------
If you want to keep your old project structure after upgrading to Nuxt 4, you should set
The knowledge sources do not explicitly state that you must change your Vitest config if you set
- Set
srcDir: '.'
in your nuxt.config.ts
to revert the source directory to the project root. This ensures that Nuxt and related tooling (including Vitest) resolve paths as they did before the upgrade New Directory Structure.
Regarding your Vitest config:The knowledge sources do not explicitly state that you must change your Vitest config if you set
srcDir: '.'
, but it is implied that your include
patterns and any referenced paths in your Vitest config should match your actual file locations. If your test files remain in the same place and your include
patterns are correct, you do not need to change your Vitest config solely because you set srcDir: '.'
.
Summary:- Set
srcDir: '.'
in your nuxt.config.ts
if you want to keep the old structure.
- Your Vitest config should match your actual test file locations and naming patterns.
- No other specific changes to the Vitest config are required according to the knowledge sources, as long as your paths and patterns are correct.
If you encounter issues, double-check that your test file locations and patterns in the Vitest config align with your project structure after setting srcDir
New Directory Structure.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai rendering components in test fails
Let me check the knowledge base for you again. One moment! :books:
----------------------
If rendering components in your tests fails after upgrading to Nuxt 4, the most common causes—according to the knowledge sources—are related to the test environment and how components are imported and mounted.
Key points to check:
1. Test Environment:
You must use the Nuxt test environment for tests that rely on Nuxt features (such as auto-imported components, composables, or context). This is done by using
Use the helpers provided by
If you are using auto-imported components, import them from
Ensure your test files are in the correct directory and match the
If you use plain
Rendering components in tests will fail if you do not use the Nuxt test environment for components that depend on Nuxt features. Use
You must use the Nuxt test environment for tests that rely on Nuxt features (such as auto-imported components, composables, or context). This is done by using
@nuxt/test-utils
and configuring your vitest.config.ts
to use the Nuxt environment for relevant test files. For example:
Unit Testing
2. Mounting Components:Use the helpers provided by
@nuxt/test-utils
, such as mountSuspended
or renderSuspended
, to mount components within the Nuxt environment. For example:
Helpers
3. Component Imports:If you are using auto-imported components, import them from
#components
in your tests. If you import directly from a path, ensure the path matches the new Nuxt 4 directory structure (e.g., ~/components/ComponentName.vue
now resolves to app/components/ComponentName.vue
).
4. File Location and Naming:Ensure your test files are in the correct directory and match the
include
pattern in your Vitest config.
If you are not using the Nuxt test environment:If you use plain
@vue/test-utils
without the Nuxt environment, you can only test components that do not rely on Nuxt features (no auto-imports, no composables, etc.) Using @vue/test-utils.
---
Summary:Rendering components in tests will fail if you do not use the Nuxt test environment for components that depend on Nuxt features. Use
@nuxt/test-utils
and the provided helpers, and ensure your test configuration matches the new Nuxt 4 structure and conventions. If you follow these steps and still encounter issues, the knowledge sources do not provide further troubleshooting steps for this specific scenario.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1030782796999970858> Kapa.ai is still learning and improving, please let me know how I did by reacting below.