@postya

Как использовать Sass во Vue 3?

Проект на Vue 3 c Typescript
Не могу подключить sass, файлы стилей не видны. Мне нужно,чтобы scss файлы были видны глобально

Что я пытался сделать:

1. Создал в корне проекта файл vue.config,js и доабвил в него
css: {
    loaderOptions: {
      sass: {
        additionalData: `
            @import "@/assets/scss/styles.scss";
            `
      }
    }
  }


2. Создал директорию scss в assets и создал там файлы
fonts.scss, global.sccs, styles/scss, variables.scss

3. В файле styles.scss импортировал все файлы scss
@import "global";
@import "variables";
@import "fonts";


Как нужно правильно использовать sass во Vue 3 проектах?

5feb2da1a469c431422582.jpeg
  • Вопрос задан
  • 89 просмотров
Пригласить эксперта
Ответы на вопрос 2
delphinpro
@delphinpro Куратор тега Sass
frontend developer
В additionalData импортируют переменные и миксины.
В styles.scss пишем стили, импортим другие файлы (переменные и миксины не требуется, но мешать не будет).
Сам styles.scss импортируем в клиентской точке входа (main.js по умолчанию, кажется, если без SSR).
Ответ написан
IVinete
@IVinete
Учусь на ошибках!
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы