How do I use variables.scss in Angular Lib using ng-packagr

[urban veldt]

Created a Angular Lib using the CLI. Now I'm trying to add some components and they are using some variables from a variables file, I can't find any documentation on how to add this global scss to the Angular Lib soo I can reach them from the exported components.

[native ridge]

Hey @urban veldt I'm having the same issue. Linked my question here incase one of us gets a solution!
https://discord.com/channels/748677963142135818/1161432491538792559

[wispy jackal]

Are you asking how to include a global scss to your published package or how to import them in the library's components styles?

I assume you are wanting to publish the package, with a global scss. Since you would have a lot of redundant duplicates, if you imported it in each exported component's styles.

To include the styles in you would add the scss to the ngPackage assets:

{
  "ngPackage": {
    "assets": [
      { "input": "src/styles", "glob": "**/*.scss", "output": "styles" }
    ],
    ...
  }
}

Docs: https://github.com/ng-packagr/ng-packagr/blob/main/docs/copy-assets.md

Then the application, depending on the package, can add them to it's styles in angular.json:

{
  "projects": {
    "my-app": {
      "architect": {
        "build": {
          "options": {
            "styles": [
              "src/styles.scss",
              "@my-lib/dist/styles.scss"
            ]
          }
        }
      }
    }
  }
}