Magento2 CSS – Fix Static Content Deploy Issue

cssdeploymagento2

I am creating a custom theme. Now I added a css file, only for checkout page.

css file call by default_head_block.xml at app/design/frontent/Amit/Customtheme/Magento_Checkout/layout/

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="Magento_Checkout::css/checkoutstyle.css" />
    </head>
</page>

Css file checkoutstyle.css location is app/design/frontent/Amit/Customtheme/Magento_Checkout/web/css.

Now when I try to deploy that css file using php bin/magento setup:static-content:deploy

I get this error:

Compilation from source: 
frontend/Magento/blank/en_US/css/styles-l.less
variable @checkout-tooltip-icon__font-size is undefined in file /var/www/html/Amit/var/view_preprocessed/css/frontend/Magento/blank/en_US/css/source/_extends.less in _extends.less on line 1056, column 21
1054|     input {
1055|         .lib-css(margin-right, @indent__s);
1056|         width: calc(~"100% - (@{checkout-tooltip-icon__font-size} + @{indent__s} + @{indent__xs})");
1057|     }
1058| }
1059| >

Note: Current application mode: developer and system is Ubuntu.

Can any one tell me what is happen?

Best Answer

Solution is deprecated: Do not Not used it. Bad idea to switch to default

It got a solution, which may not be 100% right.

  • First I change change current application mode to default from developer at app/etc/env.php ['MAGE_MODE' => 'developer' to 'MAGE_MODE' => 'default'].
  • Also,Manually by clearing the pub/static and var/view_preprocessed directories and subdirectories. except for pub/static/.htaccess
  • Then run php bin/magento setup:static-content:deploy and it successfully generate static files.
  • And change Change current application developer and run php bin/magento setup:static-content:deploy and it successfully generate static files again.

Hope this will help anyone.

Related Topic