Broken output when calc is inside box-shadow

[jaydenseric]

Using calc inside box-shadow results in broken output.

In:

.test {
  box-shadow: inset 0 calc(1em + 1px) 0 1px red;
}

Out:

.test{box-shadow:inset 0 0 1px calc(1em + 1px) red}

For some reason cssnano moves around the values.

[jaydenseric]

Turns out this is caused by orderedValues.

For webpack users that need a temporary fix, you can add -orderedValues as a query parameter to css-loader to disable the faulty transform:

{
  test: /\.css$/,
  loader: ExtractTextPlugin.extract('style', 'css?-orderedValues')
}

[ben-eb]

Thanks, fixed. 👍