Bootstrap 4 ошибка компиляции: переменные цвета, переданные во встроенные функции, не могут быть оценены как цвет - PullRequest
Новая
       7

Bootstrap 4 ошибка компиляции: переменные цвета, переданные во встроенные функции, не могут быть оценены как цвет

0 голосов
/ 10 марта 2020

Я пытаюсь добавить Bootstrap 4 в мою тему WordPress, которая использует Меньше с использованием кодов Sean 'Bootstrap Меньше порта . Однако, когда я пытаюсь скомпилировать файлы Less, я получаю сообщение об ошибке, в котором говорится, что цветовые аргументы, переданные Bootstrap Меньше функций, не могут быть оценены как цвет. В порту Less есть десятки таких ошибок (каждый раз, когда переменная цвета передается в функцию Bootstrap Less, например theme_color_level () или darken ()).

Я подозреваю, что проблема заключается в том, что цвета передаются в виде строки, когда требуется цветовой объект, но использование встроенной функции Less color () не решает проблему.

Вот пример сообщения об ошибке: 

[09:22:10] Starting 'css'...
[09:22:12] Plumber found unhandled error:
 Error in plugin "gulp-less"
Message:
    error evaluating function `each`: error evaluating function `theme-color-level`: Argument cannot be evaluated to a color in file C:\xampp\htdocs\my-site\wp-content\themes\my-theme\less\bootstrap\_tables.less line no. 101
Details:
    type: Runtime
    filename: C:\xampp\htdocs\my-site\wp-content\themes\my-theme\less\bootstrap\_tables.less
    index: 1723
    line: 101
    column: 0
    callLine: NaN
    callExtract: undefined
    extract: ,each(@theme-colors, #(@value, @color) {,  #table-row-variant(@color, theme-color-level(@color, @table-bg-level), theme-color-level(@color, @table-border-level));
    lineNumber: 101

Вот соответствующий код в _tables.less: 

each(@theme-colors, #(@value, @color) {
#table-row-variant(@color, theme-color-level(@color, @table-bg-level), theme-color-level(@color, @table-border-level));
});

Переменные цвета в _variables.less, которые циклически повторяются в примере: 

@blue:    #007bff;
@indigo:  #6610f2;
@purple:  #6f42c1;
@pink:    #e83e8c;
@red:     #dc3545;
@orange:  #fd7e14;
@yellow:  #ffc107;
@green:   #28a745;
@teal:    #20c997;
@cyan:    #17a2b8;

@primary:       @blue;
@secondary:     @gray-600;
@success:       @green;
@info:          @cyan;
@warning:       @yellow;
@danger:        @red;
@light:         @gray-100;
@dark:          @gray-800;

@theme-colors: {
primary:     @primary;
secondary:   @secondary;
success:     @success;
info:        @info;
warning:     @warning;
danger:      @danger;
light:       @light;
dark:        @dark;
};
...