Issue running extract-i18n against a component with inline styles

[terencehonles]

🐞 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, in v12 from v11

Description

When running extract-i18n on a component with inline styles there is a message about missing webpack loaders like the following:

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;
|       height: 0;

🔬 Minimal Reproduction

1. Create a new app ng new repro-app
2. Edit app.component.ts

   diff --git a/src/app/app.component.ts b/src/app/app.component.ts
   index 6d0fe10..43db9cf 100644
   --- a/src/app/app.component.ts
   +++ b/src/app/app.component.ts
   @@ -3,7 +3,7 @@ import { Component } from '@angular/core';
    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
   -  styleUrls: ['./app.component.css']
   +  styles: [':host { display: block; height: 0; }']
    })
    export class AppComponent {
      title = 'repro-app';

3. Install npm install @angular/localize
4. Run npm run ng extract-i18n

🔥 Exception or Error

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;
|       height: 0;

🌍 Your Environment

Angular CLI: 12.0.0
Node: 14.16.1
Package Manager: npm 6.14.12
OS: linux x64

Angular: 12.0.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, google-maps, language-service, localize, material
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1200.0
@angular-devkit/build-angular   12.0.0
@angular-devkit/core            12.0.0
@angular-devkit/schematics      12.0.0
@schematics/angular             12.0.0
rxjs                            6.6.7
typescript                      4.2.4

[alan-agius4]

Closed via #20749

[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.}