Getting weird errors recently when starting Nuxt
Recent change I made was adding
"type": "module" to the package.json. Then, I reinstalled all packages with pnpm install
Getting these errors:
[10:03:01 AM] ERROR Vue app aliases are not allowed in server runtime. [importing #build/app.config.mjs from nodemodules/.pnpm/[email protected]@[email protected][email protected][email protected][email protected][email protected][email protected]/node_modules/nuxt/dist/app/config.js]
[10:03:01 AM] ERROR Vue app aliases are not allowed in server runtime. [importing #build/nuxt.config.mjs from nodemodules/.pnpm/[email protected]@[email protected][email protected][email protected][email protected][email protected][email protected]/node_modules/nuxt/dist/app/nuxt.js]
[10:03:01 AM] ERROR Vue app aliases are not allowed in server runtime. [importing #app from nodemodules/.pnpm/[email protected]@[email protected][email protected][email protected][email protected][email protected][email protected]/node_modules/nuxt/dist/app/composables/route-announcer.js]
[nitro 10:03:02 AM] ERROR Error: Could not load /Users/phillip/yourproject/.nuxt/nuxt.config.mjs (imported by nodemodules/.pnpm/[email protected]@[email protected][email protected][email protected][email protected][email protected][email protected]/node_modules/nuxt/dist/app/composables/fetch.js): ENOENT: no such file or directory, open '/Users/phillip/leadpros-saas/.nuxt/nuxt.config.mjs'
----
Using NodeJS v20.18.36 Replies
Hi @Phillip. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Based on the information provided in the knowledge sources and your question, it appears you're experiencing issues related to recent changes in your Nuxt project configuration. The errors you're seeing are likely related to the addition of
"type": "module" in your package.json file, which is causing conflicts with how Nuxt resolves certain imports.
The error messages indicate that there are problems with Vue app aliases in the server runtime and issues loading configuration files. These errors are consistent with known issues in Nuxt when transitioning to native ES modules.
Here are a few potential solutions and considerations:
1. Remove "type": "module" from your package.json:
This setting is causing conflicts with how Nuxt handles imports. Nuxt has its own module resolution system, and setting "type": "module" globally can interfere with it.
2. Update Nuxt:
You're using Nuxt version 3.12.2, but there have been several releases since then that may have addressed these issues. Consider updating to the latest version (3.15.4 as of the knowledge sources) using:
3. Clear cache and reinstall dependencies:
After removing "type": "module" and updating Nuxt, try clearing your project's cache and reinstalling dependencies:
4. Check your nuxt.config.ts file:
Ensure that your Nuxt configuration file is correctly set up and doesn't contain any syntax that might be incompatible with the current Nuxt version.
5. Review your project structure:
Make sure that your project structure follows Nuxt conventions, especially regarding the location of configuration files and components.
If these steps don't resolve the issue, it might be worth checking the Nuxt GitHub Issues for similar problems or opening a new issue with your specific configuration and error messages.
Remember that transitioning to native ES modules in Node.js can sometimes cause compatibility issues with certain libraries or configurations. Nuxt is actively working on improving ESM support, but there might still be some edge cases that need to be addressed.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@728986061098713110> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai Deleted node modules, cleared pnpm cache and reinstalled packages, upgraded to newest Nuxt version which got rid of some issues. But this error remains:
[nitro 10:16:13 AM] ERROR RollupError: [plugin impound] Vue app aliases are not allowed in server runtime. [importing #build/app.config.mjs from nodemodules/.pnpm/[email protected]@[email protected][email protected][email protected][email protected][email protected][email protected]/node_modules/nuxt/dist/app/config.js]
Let me check the knowledge base for you again. One moment! :books:
----------------------
Thank you for providing an update on your situation. It seems that upgrading to the newest Nuxt version has resolved some issues, but you're still encountering an error related to Vue app aliases in the server runtime. This error is similar to those reported in recent Nuxt versions. Let's address this specific issue based on the information from our knowledge sources.
The error you're seeing is related to a known issue in Nuxt 3.15.x versions. This problem has been reported and discussed in the Nuxt GitHub repository. Here are some potential solutions and workarounds:
1. Try downgrading to Nuxt 3.15.0:
Some users have reported that downgrading to version 3.15.0 resolves this issue. You can try this by running:
Github Issue: Failed to resolve import "app-manifest" mentions this as a potential fix.
2. Clear Vite cache:
As suggested by a Nuxt team member, try removing the Vite cache:
This solution was mentioned in the Github Issue: Failed to resolve import "app-manifest".
3. Use the Nuxt nightly build:
If you're willing to use a potentially less stable but more up-to-date version, you can try the Nuxt nightly build for the 3.x branch:
This was suggested in the Upgrade Guide.
4. Disable the app manifest:
As a temporary workaround, you can disable the app manifest in your
nuxt.config.ts:
However, note that this might affect some functionality, such as client-side navigation for route rules.
If none of these solutions work, it might be worth waiting for the next patch release of Nuxt, as the Nuxt team is actively working on resolving these issues. You can also consider opening a new issue on the Nuxt GitHub repository with your specific configuration and error messages for more tailored assistance.
Remember to always back up your project before making significant changes, and test thoroughly after applying any of these solutions.
Github Issue: Failed to resolve import "app-manifest"
Upgrade Guide
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@728986061098713110> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
Turns out I had this line in a server route which is not allowed