rollupjs — import scss и css

Admin RollupJS

Как импортировать в rollupjs файлы стилей в файлах js (например, app.js).

Импорт файлов без установленных плагинов в rollupjs или в webpack, например так:

import "../scss/global.scss";
import "../scss/home.scss";

Приведет к ошибкам (rollupjs):

[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
svelte/scss/global.scss (1:5)
1: html {
^

Для импорта файлов стилей в файлах js есть несколько плагинов:

rollup-plugin-scss
rollup-plugin-postcss
sass-loader
scs-loader

import scss в rollupjs

Для rollupjs установим плагин:

npm install rollup-plugin-scss

В файле rollup.config.js импортируем его:

import scss from 'rollup-plugin-scss'

Далее там же добавим внутри plugins:

plugins: [
scss(),
]

Для того чтобы работала сборка svelte, нужно эти файл выводить отдельно так:

scss({
        output: 'public/build/common.css',
    }
),
Метки:

На сайте отсутствует реклама! Значете почему?

Помогать людям - моё хобби. А навыки разработчика позволяют не парится нулевой монетизизацией этого сайта. Хотя...

Если вам помогла информация, то даже от доната в 40 рублей мне будет приятно. Докину немного, куплю латте в макдаке, вспомню за чей счет банкет и карма вам зачтется!

Но и просто оставленный комментарий благодарности ниже принесет мне улыбку радости :)

А если захочется написать всякие гадости с переходом на личности, да тоже не стесняйтесь, но обычно я отправляю такое в спам. Люблю, когда дома чисто.

Добавить комментарий

Напишите свой комментарий, если вам есть что добавить/поправить/спросить по теме текущей статьи:
"rollupjs — import scss и css"