version 2.0.0 breaks ng Angular 8 -> webpack in my project

[JoelParke]

• Operating System: Ubuntu 19.04
• Node Version: 12.2.0
• NPM Version: - I use yarn for most, but npm 6.9.0
• webpack Version: 4.33.0
• raw-loader Version: 2.0.0

        Angular CLI: 8.0.1
        Node: 12.2.0
        OS: linux x64
        Angular: 8.0.0
        ... common, compiler, compiler-cli, core, elements, forms
        ... platform-browser, platform-browser-dynamic, router
        
        Package                           Version
        -----------------------------------------------------------
        @angular-devkit/architect         0.800.1
        @angular-devkit/build-angular     0.800.1
        @angular-devkit/build-optimizer   0.800.1
        @angular-devkit/core              8.0.1
        @angular-devkit/schematics        8.0.1
        @angular/cli                      8.0.1
        @angular/http                     7.2.15
        @schematics/angular               8.0.1
        @schematics/update                0.800.1
        rxjs                              6.5.2
        typescript                        3.4.5
        webpack                           4.33.0

Expected Behavior

not to see my web app crash:

VM568 vendor.js:14467 Uncaught Error: Expected 'styles' to be an array of strings.
    at assertArrayOfStrings (VM568 vendor.js:14467)
    at 
assertArrayOfStrings (vendor.js:14467)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNonNormalizedDirectiveMetadata (vendor.js:29784)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getEntryComponentMetadata (vendor.js:30429)
(anonymous) (vendor.js:30420)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getEntryComponentsFromProvider (vendor.js:30419)
(anonymous) (vendor.js:30392)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getProvidersMetadata (vendor.js:30355)
(anonymous) (vendor.js:30357)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getProvidersMetadata (vendor.js:30355)
(anonymous) (vendor.js:29978)
push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNgModuleMetadata (vendor.js:29969)
push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._loadModules (vendor.js:36121)
push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (vendor.js:36102)
push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler.compileModuleAsync (vendor.js:36062)
push../node_modules/@angular/platform-browser-dynamic/fesm5/platform-browser-dynamic.js.CompilerImpl.compileModuleAsync (vendor.js:73377)
compileNgModuleFactory__PRE_R3__ (vendor.js:62274)
push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule (vendor.js:62483)
./src/main.ts (main.js:23343)
__webpack_require__ (runtime.js:79)
0 (main.js:29591)
__webpack_require__ (runtime.js:79)
checkDeferredModules (runtime.js:46)
webpackJsonpCallback (runtime.js:33)
(anonymous) (main.js:1)

Actual Behavior

no errors on web side.

Code

This code that crashes is the straight Angular 8.0, and I suspect Angular 7.0 as well. I saw this earlier and back off from v2.0.0 to v1.0.0 on raw-loader.
So the question is, what could the raw loader do that could be calling without the strings and just a [Module]?

How Do We Reproduce?

Not sure, without my source and project.

Are there log messages that can be turned on in the raw-loader the could spit out what is IN and OUT. Then I could run it under v1.0.0 and then under v 2.0.0. I suspect that seeing the log, would probably determine the difference between 2.0.0 and 1.0.0.
I would be happy to do that and report back. Thanks!

Looking into the failure point in chrome, it fails at : assertArrayOfStrings(), which is being called with args:

identifier = "styles", value = [Module]

        function assertArrayOfStrings(identifier, value) {
            if (value == null) {
                return;
            }
            if (!Array.isArray(value)) {
                throw new Error("Expected '" + identifier + "' to be an array of strings.");
            }
            for (var i = 0; i < value.length; i += 1) {
                if (typeof value[i] !== 'string') {
                    throw new Error("Expected '" + identifier + "' to be an array of strings.");
                }
            }
        }
        

The webpack, is straight from ng - Angular 8. I could not attach angular.json on GitHub as a json file, so here it is as a txt file:
angular.txt

[alexander-akait]

Shortly: some of angular loader(s) is not compatibility with latest raw-loader (we use esm instead commonjs)

#77

[alexander-akait]

Can be fixed like:

function assertArrayOfStrings(identifier, value) {
            value = value && value.default ? value.default : value
            if (value == null) {
                return;
            }
            if (!Array.isArray(value)) {
                throw new Error("Expected '" + identifier + "' to be an array of strings.");
            }
            for (var i = 0; i < value.length; i += 1) {
                if (typeof value[i] !== 'string') {
                    throw new Error("Expected '" + identifier + "' to be an array of strings.");
                }
            }
        }
        

[thw0rted]

There is an issue open with angular2-template-loader, which I was using for my dev build. That project hasn't seen an update in over 2 years, so for now I'm switching from raw-loader to html-loader for component CSS includes, and it Just Works. It also has the advantage of using a single config for both dev and prod builds.

[ViieeS]

raw-loader@1.0.0 is better though, simple plug and play solution.

[thw0rted]

I'd rather keep a live dependency on the "wrong" loader than a pinned dep on the "right" one, personally. If you stick with 1.0 to avoid this bug then you're going to miss out on updates that could possibly be security-relevant.