Can't run extract-i18n if inline styles exist

[bgotink]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• extract-i18n
• run
• config
• help
• version
• doc

Is this a regression?

Yes, this worked in angular 11.x

Description

Running ng extract-i18n with at least one component that has inline styles will not succeed.

🔬 Minimal Reproduction

$ npx --package @angular/cli ng new repro
$ cd repro
$ yarn ng add @angular/localize
# if using BSD sed (e.g. macOS)
$ sed -i '' -e 's#styleUrls#styles#' -e 's#./app.component.css#:host {display: block}#' src/app/app.component.ts
# if using GNU sed (e.g. linux)
$ sed -i -e 's#styleUrls#styles#' -e 's#./app.component.css#:host {display: block}#' src/app/app.component.ts
$ yarn ng extract-i18n

🔥 Exception or Error

angular-resource:style,73733df977cae17daeb15e30f8c5975c:1:0 - Error: Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> :host {display: block}

🌍 Your Environment

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 12.0.2
Node: 14.15.3
Package Manager: yarn 1.22.4
OS: darwin x64

Angular: 12.0.2
... animations, cli, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1200.2
@angular-devkit/build-angular   12.0.2
@angular-devkit/core            12.0.2
@angular-devkit/schematics      12.0.2
@schematics/angular             12.0.2
rxjs                            6.6.7
typescript                      4.2.4
    
Done in 1.08s.

Anything else relevant?

It looks like #20972 will fix this in 12.1

[alan-agius4]

Duplicate of #20968

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}