Vue 3 Script Setup syntax + style tag scoped = bug
gde-pass opened this issue · 2 comments
gde-pass commented
Rollup Version
4.12.0
Operating System (or Browser)
Chrome
Node Version (if applicable)
18.13.0
Link To Reproduction
https://github.com/gde-pass/Vue3-Design-System-Template
Expected Behaviour
Build without error when i have a vue 3 component using script setup syntax + style tag with scoped property
Actual Behaviour
When i try to build my design system with a component using script setup syntax and with a scoped style tag i get this error:
[!] (plugin rpt2) RollupError: src/components/testworld/TestWorld.vue?vue&type=script&setup=true&lang.ts:4:22 - error TS7006: Parameter 'n' implicitly has an 'any' type.
The error is gone when:
- I remove the scoped from style tag
- I use DefineComponent syntax (with this syntax i can use scoped)
- I setup tsconfig with strict: off ( not a solution )
To be very clear, those 2 following components will NOT generate any error during build time:
<template>
<h1>
{{ age }}
</h1>
</template>
<script lang="ts">
import { PropType, defineComponent } from "vue";
export default defineComponent({
props: {
age: {
type: Number as PropType<number>,
required: true,
},
},
});
</script>
<style lang="scss" scoped>
@import "../../assets/scss/tailwind";
</style>
<template>
<h1>
{{ age }}
</h1>
</template>
<script setup lang="ts">
import { PropType } from "vue";
defineProps({
age: {
type: Number as PropType<number>,
required: true,
},
});
</script>
<style lang="scss">
@import "../../assets/scss/tailwind";
</style>
And this is a component generating the error above:
<template>
<h1>
{{ age }}
</h1>
</template>
<script setup lang="ts">
import { PropType } from "vue";
defineProps({
age: {
type: Number as PropType<number>,
required: true,
},
});
</script>
<style lang="scss" scoped>
@import "../../assets/scss/tailwind";
</style>
lukastaegert commented
I do not think we can help you here.
- the plugin throwing the error seems to be rollup-plugin-typescript2, which is not part of the rollup organization
- but I have a strong suspicion that it might actually be an issue of the Vue SFC compiler, which is also not part of the rollup organization
gde-pass commented
Okay thank you for the reply, i will post this issue on both of them.