Блог

Главная - Вопросы по программированию - Webpack; как динамически импортировать css

Webpack; как динамически импортировать css

#javascript #css #webpack

#javascript #css #webpack

Вопрос:

После поиска в Интернете я не могу найти прямого ответа, поэтому мой вопрос таков: возможно ли в webpack динамически импортировать css-файлы следующим образом :

 if(foo){
  import 'mobile.css'
} else {
  import 'desktop.css'
}

Я попробовал это, и это не сработало; есть ли обходной путь или специальный модуль webpack или что-то еще?

Комментарии:

1. ответ Романоффа здесь может дать вам представление github.com/webpack-contrib/css-loader/issues/189

2. Вы получаете какую-либо ошибку?

Ответ №1:

Это работает для меня:

 const foo = false;
if (foo) {
  require("./mobile.css");
} else {
  require("./desktop.css");
}

Также вы можете использовать динамический импорт:

 const foo = false;
if (foo) {
  import("./mobile.css");
} else {
  import("./desktop.css");
}

См.: https://stackblitz.com/edit/js-hrvzy9?file=index.js