Devextreme Реагирует "Ошибка SassError: $color: [объект объекта] не является цветом". Возникает ошибка

#reactjs #sass #devextreme

Вопрос:

Я использую Devextreme для своего проекта React, но после обновления я получил эту ошибку при сборке..

«Ошибка: $цвет: [объект Объект] не является цветом».

Версия: 21.2.3

1. Пожалуйста, проясните вашу конкретную проблему или предоставьте дополнительные сведения, чтобы выделить именно то, что вам нужно. Поскольку это написано в настоящее время, трудно точно сказать, о чем вы просите.

Ответ №1:

Проблема в том, что когда я пытаюсь создать свой проект, он изменяет файлы в темах/сгенерированных

переменные.дополнительные.scss для

 $base-accent: [object Object]; $base-text-color: [object Object]; $base-bg: [object Object]; $base-border-color: [object Object]; $base-border-radius: [object Object];

и файл variables.base.scss в

 $base-accent: [object Object]; $base-text-color: [object Object]; $base-bg: [object Object]; $base-border-color: [object Object]; $base-border-radius: [object Object];

однако, если я изменю [объект объекта] на цвета, проблема исчезнет..

переменные.дополнительные.scss для

 $base-accent: #ff5722; $base-text-color: #fff; $base-bg: #363640; $base-border-color: #515159; $base-border-radius: 4px;

и файл variables.base.scss в

 $base-accent: #ff5722; $base-text-color: rgba(0, 0, 0, 0.87); $base-bg: #fff; $base-border-color: #e0e0e0; $base-border-radius: 4px;

Кроме того, понижение вашей версии устранит проблему

«devextreme-конструктор тем»: «20.2.6»,

Кстати, в некоторых облаках он автоматически обновит его и изменит на последнюю версию. В этом случае вы просто удалите некоторые команды из своего файла devextreme.json.

Вместо этого;

 {  "applicationEngine": "react",  "build": {  "commands": [  {  "command": "build-theme",  "options": {  "inputFile": "src/themes/metadata.base.json",  "outputFile": "src/themes/generated/theme.base.css"  }  },  {  "command": "build-theme",  "options": {  "inputFile": "src/themes/metadata.additional.json",  "outputFile": "src/themes/generated/theme.additional.css"  }  },  {  "command": "export-theme-vars",  "options": {  "inputFile": "src/themes/metadata.base.json",  "outputFile": "src/themes/generated/variables.base.scss"  }  },  {  "command": "export-theme-vars",  "options": {  "inputFile": "src/themes/metadata.additional.json",  "outputFile": "src/themes/generated/variables.additional.scss"  }  }  ]  } }

используйте это;

 {  "applicationEngine": "react",  "build": {  "commands": [  {  "command": "build-theme",  "options": {  "inputFile": "src/themes/metadata.base.json",  "outputFile": "src/themes/generated/theme.base.css"  }  },  {  "command": "build-theme",  "options": {  "inputFile": "src/themes/metadata.additional.json",  "outputFile": "src/themes/generated/theme.additional.css"  }  }  ]  } }