Свернуть, как связать. css и мин. css одновременно

Question

Я использую накопительный модуль с rollup-plugin-scss в проекте для связывания css. Можно ли сгенерировать .css и .min.css с помощью этого плагина или некоторых других плагинов?

plugins: [
        scss({
            output: path.resolve(__dirname, 'projects/project_name/main.css'),
        })
]

Я пытался добавить outputStyle: "compressed", но это сделало только сжатую версию, а не обе.

Answer 1

Это невозможно из коробки, но вы подключаетесь к опции output, которая также принимает функцию в качестве опции и записывает оба файла вручную (включая этап сжатия). В приведенном ниже примере кода я использовал clean- css, но есть множество других доступных пакетов.

scss({
  output: function (styles, styleNodes) {
    fs.writeFileSync('bundle.css', styles)
    const compressed = new CleanCss().minify(styles).styles;
    fs.writeFileSync('bundle.min.css', compressed)
  }
})

Обратите внимание, что в этой настройке нет журналирования, файлов или других файлов вы получаете его из обычного плагина, но это довольно легко добавить в функцию.