Open ojvribeiro opened 4 months ago
Yes, I've seen similar issues related to import ending in /
in Nuxt after updating dependencies.
In my case it was fixed by removing /
from import, so replaced import { stuff } from 'package/src/'
with import { stuff } from 'package/src'
.
Maybe you have an import that ends with /
?
Also, for Nuxt I recommend using iconify-icon
package, not @iconify/vue
. See https://iconify.design/docs/iconify-icon/#ssr
Also, for Nuxt I recommend using
iconify-icon
package, not@iconify/vue
. See https://iconify.design/docs/iconify-icon/#ssr
Oh, I didn't know about this one. Thank you very much.
When running e2e tests I always got this error. I moved away from iconify/vue (the nuxt-icon package) to iconify-icon.
I import it via the min.js in the nuxt.config.ts
vue: {
compilerOptions: {
isCustomElement: (tag) => tag === "iconify-icon",
},
},
app: {
head: {
script: [
{
src: "https://code.iconify.design/iconify-icon/2.0.0/iconify-icon.min.js",
key: "iconify-icon",
},
],
},
},
The errors are gone. thank you @cyberalien for the recommendation.
@KarelVendla yeah, it seems the iconify-icon
package is throwing the same warning on build. It seems I'll have to stick to the CDN for now.
l
Are you using it as part of nuxt icon package or separately?
@cyberalien basically, I created a custom iconify-icon
behind the scenes. I just tried to import it in the component like this:
<script setup lang="ts">
import 'iconify-icon' // this causes build warnings
</script>
<template>
<iconify-icon icon="..." />
</template>
This snippet is a simplified version of the actual code.
Very strange. I'm importing it like that in Vue project too, no issues.
Can you post versions of vite, node and whatever package manager are you using?
Yeah, of course! This is the info generated by nuxt info
:
------------------------------
- Operating System: Windows_NT
- Node Version: v18.19.0
- Nuxt Version: 3.9.3
- CLI Version: 3.8.4
- Nitro Version: 2.8.1
- Package Manager: yarn@1.22.19
- Builder: -
- User Config: extends, modules, imports, routeRules, app, googleFonts, tailwindcss, devtools
- Runtime Modules: nuxt-typed-router@3.5.1, @vee-validate/nuxt@4.12.4, @nuxtjs/device@3.1.1, nuxt-og-image@3.0.0-rc.38
- Build Modules: -
------------------------------
It is important to note that the warning only shows on build, not dev. It happens to @vueuse/core
as well.
I've seen reports that removing shamefully-hoist=true
from .npmrc
fixes that.
I've seen reports that removing
shamefully-hoist=true
from.npmrc
fixes that.
The warning is still present
I started receiving this warning when I updated to latest Vue and Nuxt versions:
I'm not sure if it is a @iconify/vue thing.