You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser...

After updating from Angular 11 to 12, ng serve is now throwing an error:

Error: /Users/btaylor/work/angular-apps/mdsl-authoring/assets/scss/_colors.scss:1:4: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

Error: /Users/btaylor/work/angular-apps/mdsl-authoring/assets/scss/custom-bootstrap.scss:1:1: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

Error: /Users/btaylor/work/angular-apps/mdsl-authoring/assets/scss/global.scss:296:12: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

Error: /Users/btaylor/work/angular-apps/mdsl-authoring/assets/scss/mdsl-composer/mdsl-composer-variables.scss:103:1: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser


None of the SCSS files in question is doing anything special. _colors.scss for example is simply:

// Bootstrap Overrides
$text-secondary: #2E93B1;
$text-muted: #ccc;
$link-color: #2E93B1;

.text-secondary {
color: $text-secondary !important;
}

// LabCorp UI Overrides
$theme-colors: (
'primary': #003A70,
'secondary': #2E93B1,
'success': #155724,
'danger': #790E1D,
'warning': #C59C38,
'info': #007A6E,
'light': #EDF1F4,
'dark': #0B1519,
);

// UI design colors
$primary: #007FA3;
$highlighted: #D57800;
$accent: #5F456F;
$accent-secondary: #808080;
$related: #D1EAF1;


So I'm not sure what Unknown word the parser is complaining about.

I'm not finding very much information online regarding this error with Angular.

The rest of the project code will compile as expected, but now the application won't run. I'm not sure what other code to provide here, but am more than happy to post whatever would be helpful for debugging.

The error is specific to Angular CLI. Our project uses Angular Universal, and building the code and serving it via Node work as expected.

Continue reading...