ngx-quill: Weird Error: ' NullInjectorError: No provider for config!'

I have been using quill editor in my projects for almost a year, just went from angular 4.3.5 using ngx-quill 1.6 to angular 7.1.3 and ngx-quill 4.4.2 with quill 1.3.6 and now I am getting the below. I thought it was my dropzone wrapper for a while, I decided to start commenting out different html sections of my component until I found the culprit.

                                <div class="m-b-md" *ngIf="true">
                                    <quill-editor (onEditorCreated)="applyAccessibilityHacks($event)" [modules]="toolBarConfig" [(ngModel)]="currItem.BasicItemDescription" id="storydescription" name="storydescription" [maxlength]="2000"></quill-editor>
                                </div>

When *ngIf is set to true above the below error is thrown, when false, no error is thrown on the page.

ERROR Error: StaticInjectorError(AppModule)[config]: 
  StaticInjectorError(Platform: core)[config]: 
    NullInjectorError: No provider for config!

I was not sure about the line “for builds with angular-cli >=6 only add quilljs to your scripts!” so I commented out ngx-quill, I have tried both ways and neither works, same error.

(function (global) {
    System.config({
        transpiler: 'traceur',
        paths: {
            // paths serve as alias
            'npm:': '../../Areas/node_modules/',
            'app:': '../../Areas/MyEventWebsite/App/'
        },
        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: '../App',
            // angular bundles
            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.js',
            '@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js',
            '@angular/core': 'npm:@angular/core/bundles/core.umd.min.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.min.js',
            '@angular/common/http': 'npm:@angular/common/bundles/common-http.umd.min.js',
            'tslib': 'npm:tslib/tslib.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.min.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.min.js',
            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.min.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.min.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.min.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.min.js',
            // other libraries
            'rxjs': 'npm:rxjs',
            'traceur': 'npm:traceur/src',
            'ng2-dnd': 'npm:ng2-dnd/bundles/index.umd.js',
            'ngx-dropzone-wrapper': 'npm:ngx-dropzone-wrapper/bundles/ngx-dropzone-wrapper.umd.js',
            'croppie': 'npm:croppie/croppie.js',
            'ng2-validation': 'npm:ng2-validation/bundles/ng2-validation.umd.js',
            'libphonenumber-js': 'npm:libphonenumber-js/bundle/libphonenumber-js.min.js', //Required for ng2-validation...why... no idea
            'ng2-dragula': 'npm:ng2-dragula/bundles/ng2-dragula.umd.js',
            'ngx-cookie': 'npm:ngx-cookie/bundles/ngx-cookie.umd.js',
            'angular2-datetimepicker': 'npm:angular2-datetimepicker/index.umd.min.js',
            'nouislider': 'npm:nouislider',
            'ng2-nouislider': 'npm:ng2-nouislider',
            'ngx-color-picker': 'npm:ngx-color-picker/bundles/ngx-color-picker.umd.min.js',
            //'ngx-tags-input': 'npm:ngx-tags-input',
            'ngx-bootstrap/typeahead': 'npm:ngx-bootstrap',
            //'ngx-quill': 'npm:ngx-quill/bundles/ngx-quill.umd.js',
            'quill': 'npm:quill/dist/quill.js'
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            '.': {
                defaultJSExtensions: 'js'
            },
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            rxjs: {
                defaultExtension: 'js'
            },
            traceur: {
                main: 'traceur'
            },
            'nouislider': {
                main: 'distribute/nouislider.js',
                defaultExtension: 'js'
            },
            'ng2-nouislider': {
                main: 'src/nouislider.js',
                defaultExtension: 'js'
            },
            'ngx-bootstrap/typeahead':
                {
                    format: 'cjs',
                    main: 'bundles/ngx-bootstrap.umd.js',
                    defaultExtension: 'js'
                },/*
            'ngx-quill': {
                format: 'cjs',
                meta: {
                    deps: ['quill']
                }
            },*/
            'quill': {
                format: 'cjs'
            }
        },
        defaultJSExtensions: true
    });
})(this);

  "dependencies": {
    "@angular/animations": "7.1.3",
    "@angular/cdk": "^7.1.1",
    "@angular/common": "7.1.3",
    "@angular/compiler": "7.1.3",
    "@angular/compiler-cli": "7.1.3",
    "@angular/core": "7.1.3",
    "@angular/flex-layout": "^7.0.0-beta.19",
    "@angular/forms": "7.1.3",
    "@angular/http": "7.1.3",
    "@angular/material": "^7.1.1",
    "@angular/platform-browser": "7.1.3",
    "@angular/platform-browser-dynamic": "7.1.3",
    "@angular/platform-server": "7.1.3",
    "@angular/router": "7.1.3",
    "@angular/upgrade": "7.1.3",
    "@types/jquery": "^2.0.51",
    "angular2-datetimepicker": "^1.1.1",
    "bootstrap": "^3.3.7",
    "core-js": "^2.6.0",
    "croppie": "^2.6.2",
    "jquery": "^3.3.1",
    "ng2-dnd": "^4.2.0",
    "ng2-dragula": "^1.5.0",
    "ng2-nouislider": "^1.7.13",
    "ng2-validation": "^4.2.0",
    "ngx-color-picker": "^4.5.3",
    "ngx-cookie": "^1.0.1",
    "ngx-dropzone-wrapper": "^7.1.0",
    "ngx-quill": "^4.4.2",
    "nouislider": "^11.1.0",
    "quill": "^1.3.6",
    "reflect-metadata": "^0.1.12",
    "rxjs": "^6.3.3",
    "save": "^2.3.3",
    "systemjs": "0.19.39",
    "traceur": "0.0.111",
    "tslib": "^1.9.0",
    "typescript": "3.1.6",
    "zone.js": "^0.8.26"
  }

Thoughts or suggestions?

Thanks!