Как импортировать CSS с заданной областью действия в Vue 3?

Кто-нибудь знает, как импортировать файл CSS с заданной областью действия в Vue 3?

Я попытался включить код в тег script (см. ниже), но он просто включает CSS глобально. Затем я попытался добавить его в атрибут src для тега стиля, который работает, но игнорирует стили внутри тега стиля (также показано ниже).

Включить тег скрипта

<script>
import '@/assets/sass/styles.sass'
export default {   
...

Включить тег стиля

<style lang="sass" src="@/assets/sass/styles.sass" scoped>
/* wrapper style ignored if I include src */
#wrapper   
...

vue.js vuejs3
person Gnoll Team    schedule 27.08.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Хорошо, смог понять это сразу после публикации вопроса. Для всех, у кого есть эта проблема, вы можете просто вызвать импорт в своем теге стиля, и он будет поддерживать статус области действия. Пример ниже...

<style lang="sass" scoped>
import '@/assets/sass/styles.sass'
/* wrapper is now recognized */
#wrapper   
...
person Gnoll Team    schedule 27.08.2020