Disable "postcss-calc" postcss plugin #5741

yairEO · 2021-01-31T18:40:07Z

yairEO
Jan 31, 2021

I am using extremely complex CSS and get an error:

My css is using directly in the index.html <head> section inside a plain <style> tag. I wish there was a way to completely ignore it when telling Parcel to build the code

$ npm run prod

> [email protected] prod
> parcel build index.html --dist-dir build

��� Build failed.
@parcel/optimizer-htmlnano: Parse error on line 1: 
1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + .001)
---------------------------------------------------------^
Expecting end of input, "ADD", "SUB", "MUL", "DIV", got unexpected "RPAREN"
JisonParserError: Parse error on line 1: 
1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + .001)
---------------------------------------------------------^
Expecting end of input, "ADD", "SUB", "MUL", "DIV", got unexpected "RPAREN"
    at <input css 1>:1:1631
    at Parser.parseError (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\parser.js:1200:15)
    at Parser.parse (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\parser.js:1716:30)
    at C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\lib\transform.js:33:30
    at walk (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-value-parser\lib\walk.js:7:16)
    at walk (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-value-parser\lib\walk.js:15:7)
    at ValueParser.walk (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-value-parser\lib\index.js:18:3)
    at transformValue (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\lib\transform.js:24:50)
    at _default (C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\lib\transform.js:66:100)
    at C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\postcss-calc\dist\index.js:27:32
    at C:\Program Files (x86)\Nodist\bin\node_modules\parcel\node_modules\cssnano\node_modules\postcss\lib\container.js:139:18

I suspect postcss-calc or cssnano are trying to do something which ends up screwing things up and I have no idea how to disable at least postcss-calc to test..

I've tried creating a .postcssrc file with:

{
  "modules": false,
  "plugins": {
    "postcss-calc": false,
    "autoprefixer": {
      "grid": false
    }
  }
}

and cssnano.config.js

module.exports = {
  preset: [
    'default',
    {
      calc: false,
      discardComments: {
        removeAll: true
      }
    }
  ]
}

The error persists when trying to build the project.
when simply running the parcel and watching + local server everything works as expected

yairEO · 2021-01-31T19:00:07Z

yairEO
Jan 31, 2021
Author

Alright, weird.

This was the line:

--thumbs-too-close: Clamp(-1, Calc(1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1))  +  .001)), 1);

Changed it to this and now it works:

--thumbs-too-close: Clamp(-1, 1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1))  +  .001), 1);

Somehow SASS parsed it well in a separate isolated demo but Parcel's PostCSS didn't

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Disable "postcss-calc" postcss plugin #5741

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 1 comment

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Select a reply

Disable "postcss-calc" postcss plugin #5741

yairEO Jan 31, 2021

Replies: 1 comment

yairEO Jan 31, 2021 Author

yairEO
Jan 31, 2021

yairEO
Jan 31, 2021
Author