Creating an optimized production build...
Failed to compile.
Lexical error on line 1: Unrecognized text.
Erroneous area:
1: $progress-size - 2 * $border-size
^..^
I encounter the above compilation failure when doing a production build after migrating from create-react-app v1 to create-react-app v2. The local development, i.e: yarn start
, is working properly.
NOTE: I do not encounter this issue in create-react-app v1.
I tried fixing this by using SCSS
interpolation, i.e: wrap $progress-size
and $border-size
with #{}
--> #{$progress-size}
#{$border-size}
and it solves the problems.
Screenshot of the above error message
Can anyone explain why I have to fix it like that and if there's a better way?