search

assetgraph / assetgraph-i18n

i18n plugin for assetgraph-builder
BSD 3-Clause "New" or "Revised" License
3 stars 1 forks source link

CssSyntaxError error in less file #16

Open rab1 opened 5 years ago

rab1 commented 5 years ago

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 commented 5 years ago

I think it's a similar issue like https://github.com/postcss/postcss/issues/1102

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

papandreou commented 5 years ago

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 commented 5 years ago

It included via link

<link rel="stylesheet" type="text/css" href="/shop/less/theme.less">
papandreou commented 5 years ago

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 commented 5 years ago

We are using assetgraph-builder@6.4.3

papandreou commented 5 years ago

Good! What about the other questions?