в идеале собственными руками

понимаю

потому что только тогда unused style removal стилей из коробки будет работать

Есть любят отделять логику от вида, делая стили вообще отдельно, импорты внутри главного цсс файла

ну смешно же) css 3/js 250 )

ну и в целом, смысл свелт компонентов - максимальная инакпсуляция от внешнего мира, а значит переносимость и переиспользуемость

Это да

это не про single file component

Ну и препроцессинг scss не с 1 раза настроить можно

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

А в цсс писать... как то ы

у меня сложностей не бывало, разве что с подсветкой

по-умолчанию стили попадают в бандл компонента, таким образом из коробки поддерживается code-splitting и динамическая подгрузка компонентов с их стилями

можно все стили выкинуть в один файл и чаще всего так и делают

вот такой подход есть:

export default function (code = "") {
   return new Promise(resolve => {
      const blob = URL.createObjectURL(new Blob([ code ], { 
               type: "application/javascript" 
      }));
      import(/* webpackIgnore: true */ blob).then(m => {
              m = m.default;
              resolve(m);
              URL.revokeObjectURL(blob);
       });
   });
}

правда использовался в проекте с вебпаком и я не в курсе можно ли завести на роллап

спасибо, гляну, почему бы и не попробовать

юзать так:

const res = await fetch('/mycode');

const myJsModule = execute(await res.text());

то есть код в виде строки превращается в код)

чудны дела, слил все в global.css