Magento 2 - Can't compile new theme, which inherits from luma

Question

I created a new minimalistic theme in a fresh Magento 2.4.2

The theme inherits from Magento/luma

Example:

app/design/frontend/company/foo/registration.php:

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

use \Magento\Framework\Component\ComponentRegistrar;

ComponentRegistrar::register(ComponentRegistrar::THEME, 'frontend/company/foo', __DIR__);

app/design/frontend/company/foo/theme.xml

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Foo</title>
    <parent>Magento/luma</parent>
</theme>

dev/tools/grunt/configs/local-themes.js:

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

 'use strict';

 /**
  * Define Themes
  *
  * area: area, one of (frontend|adminhtml|doc),
  * name: theme name in format Vendor/theme-name,
  * locale: locale,
  * files: [
  * 'css/styles-m',
  * 'css/styles-l'
  * ],
  * dsl: dynamic stylesheet language (less|sass)
  *
  */
 module.exports = {
     company_foo: {
         area: 'frontend',
         name: 'company/foo',
         locale: 'de_DE',
         files: [
             'css/styles-m',
             'css/styles-l'
         ],
         dsl: 'less'
     }
 };

Next I executed php bin/magento setup:upgrade. If I compile with grunt refresh then it builds successfully.

Problem:

If I add these two files ...

app/design/frontend/company/foo/web/css/source/_extend.less:

@import '_test.less';

app/design/frontend/company/foo/web/css/source/_test.less

body { background: black; }

... and compile with grunt refresh, then I get:

Running "less:company_foo" (less) task
>> NameError: variable @sidebar__background-color is undefined in pub/static/frontend/company/foo/de_DE/css/source/_tables.less on line 21, column 34:
>> 20         tfoot {
>> 21             .lib-css(background, @sidebar__background-color);
>> 22             > tr {
Warning: Error compiling pub/static/frontend/company/foo/de_DE/css/styles-m.less Use --force to continue.

Aborted due to warnings.

---

All occurences of sidebar__background-color in the codebase:

var/view_preprocessed/pub/static/frontend/company/foo/de_DE/Magento_Checkout/css/source/module/_cart.less:        .lib-css(background, @sidebar__background-color);
var/view_preprocessed/pub/static/frontend/company/foo/de_DE/Magento_Theme/css/source/module/_collapsible_navigation.less:@collapsible-nav-background: @sidebar__background-color;
var/view_preprocessed/pub/static/frontend/company/foo/de_DE/css/source/_extends.less:            .lib-css(background, @sidebar__background-color);
var/view_preprocessed/pub/static/frontend/company/foo/de_DE/css/source/_tables.less:            .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-luma/Magento_Checkout/web/css/source/module/_cart.less:        .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-luma/web/css/source/_variables.less:@sidebar__background-color: @color-white-smoke; // Used in cart sidebar, Checkout sidebar, Tier Prices, My account navigation, Rating block background
vendor/magento/theme-frontend-luma/web/css/source/_extends.less:            .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-luma/web/css/source/_tables.less:            .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-blank/Magento_Checkout/web/css/source/module/_cart.less:        .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-blank/Magento_Catalog/web/css/source/_module.less:        .lib-css(background, @sidebar__background-color);
vendor/magento/theme-frontend-blank/Magento_Theme/web/css/source/module/_collapsible_navigation.less:@collapsible-nav-background: @sidebar__background-color;
vendor/magento/theme-frontend-blank/web/css/source/_variables.less:@sidebar__background-color: @color-white-smoke; // Used in cart sidebar, Checkout sidebar, Tier Prices, My account navigation, Rating block background
vendor/magento/theme-frontend-blank/Magento_Customer/web/css/source/_module.less:@account-nav-background: @sidebar__background-color;

Answer 1

Notice this error:

NameError: variable @sidebar__background-color is undefined in pub/static/frontend/company/foo/de_DE/css/source/_tables.less on line 21, column 34:

In no place in the code you've mentioned is sidebar__background-color defined. Try looking for where it is used:

$ grep -r 'sidebar__background-color' *

EDIT

With the new information, we see that sidebar__background-color is defined in vendor/magento/theme-frontend-blank/web/css/source/_variables.less.

So add this code to app/design/frontend/company/foo/web/css/source/_extend.less:

@import '_variables.less';