Magento2: Variable @sidebar__background-color is undefined

Created on 2 Feb 2017  路  10Comments  路  Source: magento/magento2

After the git pull today I get the error described in the title.

variable @sidebar__background-color is undefined

.../it_IT/Magento_Catalog/css/source/_module.less in _module.less on line 365, column 30
363| .prices-tier {
364| &:extend(.abs-reset-list all);
365| .lib-css(background, @sidebar__background-color);
366| margin: @indent__s 0;
367| padding: @indent__s (.75 * @indent__base);
368|

Preconditions

Ubuntu, Standard LAMP (Apache, MySQL, ....)

PHP 7.0.8-0ubuntu0.16.04.3 (cli) ( NTS )
Copyright (c) 1997-2016 The PHP Group
Zend Engine v3.0.0, Copyright (c) 1998-2016 Zend Technologies

mysql Ver 14.14 Distrib 5.7.17, for Linux (x86_64) using EditLine wrapper

HEAD -> develop

Steps to reproduce

  1. Clean up the cache
  2. bin/magento setup:upgrade
  3. open the website store page

Expected result

  1. show the normal webpage

Actual result

selezione_023

browsing the code the @sidebar__background-color exists!

selezione_022

What happened? Thanks

Catalog Cannot Reproduce Clear Description Format is valid bug report

Most helpful comment

What if I don't have a "_module.less" file in my theme?

I get a similar error in "system.log", and it also becomes the content of "http://m2training.dev/static/version1509459998/frontend/Company/training-theme/en_GB/css/styles-l.css" response:

variable @copyright__background-color is undefined in file /var/www/m2training/public/var/view_preprocessed/pub/static/frontend/Company/training-theme/en_GB/Magento_Theme/css/source/_module.less in _module.less on line 438, column 40
436|     body {
437|         .ie9 & {
438|             .lib-css(background-color, @copyright__background-color);
439|         }
440|     }
441|  in _responsive.less

followed by backtrace from "Less\Processor->processContent"

And I think I was not working with CSS at all when the error appeared (which happened I don't know exactly at what point), but trying to install Magento sample Command module. I had made a small CSS adjustment the day before this, and the CSS preprocessor was working fine at that point. The only CSS in that theme is web/css/source/_theme.less and contains just one modification.

All 10 comments

Seems to me that the proble is related to the _module.less. This file is not present in the Magento_Catalog blank design directory. Any idea?

I have solved deleting the _module.less created in my own theme. After the compilation Magento works like a charm!
selezione_022

@shinesoftware, thank you for your report.
We were not able to reproduce this issue by following the steps you provided. If you'd like to update it, please reopen the issue.
We tested the issue on 2.3.0-dev, 2.2.0, 2.1.9

What if I don't have a "_module.less" file in my theme?

I get a similar error in "system.log", and it also becomes the content of "http://m2training.dev/static/version1509459998/frontend/Company/training-theme/en_GB/css/styles-l.css" response:

variable @copyright__background-color is undefined in file /var/www/m2training/public/var/view_preprocessed/pub/static/frontend/Company/training-theme/en_GB/Magento_Theme/css/source/_module.less in _module.less on line 438, column 40
436|     body {
437|         .ie9 & {
438|             .lib-css(background-color, @copyright__background-color);
439|         }
440|     }
441|  in _responsive.less

followed by backtrace from "Less\Processor->processContent"

And I think I was not working with CSS at all when the error appeared (which happened I don't know exactly at what point), but trying to install Magento sample Command module. I had made a small CSS adjustment the day before this, and the CSS preprocessor was working fine at that point. The only CSS in that theme is web/css/source/_theme.less and contains just one modification.

I found a fairly cheap solution to this problem. I just upgraded from 2.1.10 to 2.2.2 and was getting the same error:

during static content deploy:
@sidebar__background-color is not defined

I just found where that variable is defined and copied it in my own theme like so:

@sidebar__background-color: #f5f5f5;

/app/design/frontend/Company/CustomTheme/web/css/source/_variables.less

@mzenner1 That woks for me too.

It seems that they forgot to define a @sidebar__background-color: in
Path to native: /vendor/magento/theme-frontend-luma/Magento_Theme/web/css/source/_module.less

@magento-engcom-team This is a bug!

@block-items__counter__color also have the same problem on Magento 2.2.2. I'm sure this is a bug.

Just encountered this in 2.2.5 as well

In general, this happens when you start a custom theme, so you need to run the command php magento setup:upgrade to ensure that you have cleared the static content, and then the deployer will run correctly.

I discovered that the original theme developer extended the parent theme "Magento/luma" but didn't copy in the _theme.less file from the parent as instructed in Magento's dev docs. Once those includes were copied in, everything worked as expected.

See here for reference:
https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/css-guide/css_quick_guide_approach.html#simple_override

Was this page helpful?
0 / 5 - 0 ratings