Динамический меньший импорт темы в Vite на основе переменной среды ⇐ CSS

[Anonymous]

Я строю приложение с VITE, где структура проектов одинакова, но разные проекты нуждаются в разных цветовых темах. Каждый проект имеет свой собственный файл .less с одинаковыми именами переменных, но разные значения. Я пытаюсь динамически импортировать правильный файл темы на основе переменной среды VITE_APP_SITE_NAME , который включает в себя имя проекта, например, Project ,

Код: Выделить всё

project2

,

Код: Выделить всё

project3

, но я не могу заставить его работать. Ранее я использовал JavaScript для обработки этого, но становится трудно переопределять значение по умолчанию Ant Design, используя переменные темы, поскольку я должен использовать подход innerhtml < /p>
Текущая настройка < /p>

Код: Выделить всё

src/
assets/
style/
project1/        # Theme for project1
variable.less  # Contains @primary-color: #123456;
project2/        # Theme for project2
variable.less  # Contains @primary-color: #654321;
variable.less      # Should dynamically import the correct project variables
App.tsx
App.less
vite.config.js

ogle

• Установить Vite_App_site_name = Project1 или Project2 в среде
• Когда компонент импорт/стиль/переменная. Assets/style/project1/variable.less , когда vite_app_site_name = project1
• Resolve to Assets/style/project2/variable.less when vite_app_site_name = project2

Подробнее здесь: https://stackoverflow.com/questions/795 ... t-variable