Hashmode, dynamic asset url

Hey there!

I'm using a component from a layer which use a public image, which src is based on some conditions.

On my component, it looks like somethings like this:

<template>
   <img :src="something" />
</template>
<script setup lang="ts">
const something = useSomeMagic();
</script>

<template>
   <img :src="something" />
</template>
<script setup lang="ts">
const something = useSomeMagic();
</script>

utils/useSomeMagic.ts
export default () => {
    const theme = useTheme();
    return `/img.${theme.current.value.isDark ? 'dark': 'ligh'}.svg`
}

utils/useSomeMagic.ts
export default () => {
    const theme = useTheme();
    return `/img.${theme.current.value.isDark ? 'dark': 'ligh'}.svg`
}

Once I run

npx nuxi generate

npx nuxi generate

, everything seems fine and app is running, BUT, where my custom component is loaded, image urls are not converted into

./$src

./$src

.

I guess as image source are defined at runtime, url cannot be converted at buildTime. Is there a way for me to detect that hashMode has been enable, then provide the expected source (ie,

./$src

./$src

Nuxt•2y ago•

1 reply

kogratte

Hashmode, dynamic asset url

Hey there!

I'm using a component from a layer which use a public image, which src is based on some conditions.

On my component, it looks like somethings like this:

<template>
   <img :src="something" />
</template>
<script setup lang="ts">
const something = useSomeMagic();
</script>

<template>
   <img :src="something" />
</template>
<script setup lang="ts">
const something = useSomeMagic();
</script>

utils/useSomeMagic.ts
export default () => {
    const theme = useTheme();
    return `/img.${theme.current.value.isDark ? 'dark': 'ligh'}.svg`
}

utils/useSomeMagic.ts
export default () => {
    const theme = useTheme();
    return `/img.${theme.current.value.isDark ? 'dark': 'ligh'}.svg`
}

Once I run

npx nuxi generate

npx nuxi generate

, everything seems fine and app is running, BUT, where my custom component is loaded, image urls are not converted into

./$src

./$src

.

I guess as image source are defined at runtime, url cannot be converted at buildTime. Is there a way for me to detect that hashMode has been enable, then provide the expected source (ie,

./$src

./$src

Hashmode, dynamic asset url

Similar Threads

Hashmode, dynamic asset url

Similar Threads

Similar Threads

Similar Threads