0

How can I style v-html content with scoped css using @import?

There is an explanation on how to use ::v-deep here, but in my case I'd like to include a CSS file using @import.

I tried the following but it doesn't work:

<template>
  <div v-html="richtext" />
</template>
...
<style lang="scss" scoped>
  @import 'assets/scss/imports/headers.scss';
</style>

I could import the style globally which does work but my goal is to only import it in this richtext component.

Dollique
  • 952
  • 2
  • 10
  • 29

1 Answers1

0

I normally do it using the src attribute

<style lang="scss" src="@/assets/scss/imports/headers.scss"></style>
Toni Michel Caubet
  • 19,333
  • 56
  • 202
  • 378
  • This does ignore the scoped attribute. It does work, but it's similar to loading the import globally. – Dollique Aug 22 '22 at 11:34