CssSyntaxError error in less file

[rab1]

While running checklanguagekeys getting error in valid less comment syntax

button {
    &:focus {
        //To avoid weird outline for buttons with border radius
        outline: none; 
    }
}

This issue was not there in "assetgraph-builder": "4.12.2", error stack is

CssSyntaxError: file:///home/rab/shop/http-pub/shop/less/theme.less:165:28: Unknown word
    at Input.error (/home/rab/shop/node_modules/assetgraph/node_modules/postcss/lib/input.js:130:16)
    at Parser.unknownWord (/home/rab/shop/node_modules/assetgraph/node_modules/postcss/lib/parser.js:563:22)
    at Parser.other (/home/rab/shop/node_modules/assetgraph/node_modules/postcss/lib/parser.js:168:12)
    at Parser.parse (/home/rab/shop/node_modules/assetgraph/node_modules/postcss/lib/parser.js:77:16)
    at Function.parse (/home/rab/shop/node_modules/assetgraph/node_modules/postcss/lib/parse.js:17:12)
    at Css.get parseTree [as parseTree] (/home/rab/shop/node_modules/assetgraph/lib/assets/Css.js:117:35)
    at Css.eachRuleInParseTree (/home/rab/shop/node_modules/assetgraph/lib/assets/Css.js:374:34)
    at Css.findOutgoingRelationsInParseTree (/home/rab/shop/node_modules/assetgraph/lib/assets/Css.js:239:10)
    at Css.get outgoingRelations [as outgoingRelations] (/home/rab/shop/node_modules/assetgraph/lib/assets/Asset.js:1075:38)
    at Css.populate (/home/rab/shop/node_modules/assetgraph/lib/assets/Asset.js:1312:12)
    at Css.load (/home/rab/shop/node_modules/assetgraph/lib/assets/Asset.js:515:14)
    at <anonymous>

[rab1]

I think it's a similar issue like postcss/postcss#1102

How to add syntax option as postcss-less into checklanguagekeys ?

[papandreou]

AssetGraph doesn't transpile anything (so injecting postcss-less isn't really an option).

theme.less shouldn't be parsed as CSS when it has a .less extension, so it's a bit weird.

How is theme.less being referenced? Via an @import(...) or a <link rel=stylesheet href=...>?

[rab1]

It included via link

<link rel="stylesheet" type="text/css" href="/shop/less/theme.less">

[papandreou]

Right, then assetgraph is inferring that the target asset is CSS because of the fact that it has a <link rel=stylesheet href=...> pointing at it, which is not really unreasonable.

What sees to it that this file gets transpiled in your dev setup (server middleware?) and in your production build (assetgraph-builder < 5?)

Which version of assetgraph-builder are you using?

[rab1]

We are using [email protected]

[papandreou]

Good! What about the other questions?