Environment
Nuxt project info: 20:41:00
- Operating System:
Darwin
- Node Version:
v14.18.3
- Nuxt Version:
3.0.0-rc.8
- Package Manager:
[email protected]
- Builder:
vite
- User Config:
typescript
- Runtime Modules:
-
- Build Modules:
-
Reproduction
1- Nothing special, just create a new project using pnpm:
pnpm dlx nuxi init nuxt3-app-rc8
cd nuxt3-app-rc8
pnpm install --shamefully-hoist
2- Edit the app.vue
page to pass version
as a props to the NuxtWelcome
component:
<template>
<div>
<NuxtWelcome :version="version" />
</div>
</template>
<script setup>
const props = defineProps({
version: {
type: String,
default: 'v3.0.0-rc.8'
}
})
</script>
P.S. The version
prop according the definition is a String, so a value like v3.0.0-rc.8
should be accepted.
3- Finally run the project:
Describe the bug
Current behavior:
The generated url looks like this:
https://github.com/nuxt/framework/releases/tag/%7B%7B%20version%20%7D%7D
and when you click on the link, you'll be redirected to the 404 page.
Expected behavior:
The generated url should be like this:
https://github.com/nuxt/framework/releases/tag/v3.0.0-rc.8
Although in both cases the generated HTML looks like this:
<a href="https://github.com/nuxt/framework/releases/tag/v3.0.0-rc.8" target="_blank" rel="noopener" class="flex justify-end pb-1 sm:pb-2" data-v-e12da2d6="">v3.0.0-rc.8</a>
Additional context
A quick -dirty- fix would be to edit /node_modules/.pnpm/@[email protected]/node_modules/@nuxt/ui-templates/dist/templates/welcome.vue
like so:
<a :href="`https://github.com/nuxt/framework/releases/tag/${version}`" target="_blank" rel="noopener" class="flex justify-end pb-1 sm:pb-2" v-text="version" />
This would apply the string interpolation correctly, and here is the original generated source:
<a href="https://github.com/nuxt/framework/releases/tag/{{version}}" target="_blank" rel="noopener" class="flex justify-end pb-1 sm:pb-2" v-text="version" />
I couldn't find the original template, since welcome.vue
is generated using the magic on the fly, and I know this may have no impact to the framework it self, since it's just a welcome
component example, but this may solve another similar issue in some other places.
Logs
No response