Dynamically Load CSS with the Angular CLI

Viewed 1424

I want to be able to dinamically load CSS in my Angular Project. For that I followed all the steps at this tutorial here: https://juristr.com/blog/2019/08/dynamically-load-css-angular-cli/

Unfortunately I am stuck at this problem in my angular.json below:

"dyncss": {
    ...
    "build": {
        ...
        options: {
          ...
          "styles": [
            "src/styles.scss",
            {
              "input": "src/client-a-styles.scss",
              "bundleName": "client-a",
              "inject": false
            },
            {
              "input": "src/client-b-styles.scss",
              "bundleName": "client-b",
              "inject": false
            }
          ],
        }
    },
    ...
},

As soon as I add the line: "inject": false, I got these errors here:

"Schema validation failed with the following errors: Data path ".styles[1]" should NOT have additional properties(inject). Data path ".styles[1]" should be string. Data path ".styles[1]" should match exactly one schema in oneOf"

If I remove the line "inject": false ng build work correctly but I have to put inject to be able to load the css dinamically afterwards...

p.s.: Angular version ^9.1.3

Please, any help is really welcome! Thanks in advance!

1 Answers

Try to update your packages properly. Make sure all the packages are up to date. I had similar issues, I forgot to update "ngx-build-plus" to match to my angular project version.

Related