Not importing <style></style> inside SFC file?
DouglasCalora opened this issue · comments
DouglasCalora commented
Clear and concise description of the problem
I have components that has <style> inside, this scss styles are not being imported, and there are no mention about it in documentation.
An example of component:
<template>
<div aria-live="polite" class="qas-status" :class="backgroundClass" role="status" />
</template>
<script setup>
import { computed } from 'vue'
defineOptions({
name: 'QasStatus',
inheritAttrs: false
})
const props = defineProps({
color: {
type: String,
default: 'light-blue-2'
}
})
const backgroundClass = computed(() => `bg-${props.color}`)
</script>
<style lang="scss">
.qas-status {
background-color: red;
border-radius: 100%;
height: 16px;
width: 16px;
}
</style>
The styles of class qas-status
are not being applied.
Suggested solution
What to do?
Alternative
No response
Additional context
No response
Validations
- Follow our Code of Conduct
- Read the Contributing Guide.
- Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
NotGeekAtAll commented
#794
I have same problem, no idea how to solve it.