Import SCSS variables file in Angular library modules

I am working on a project which is an Angular Library(which uses SCSS).

My project structure is like this

├───UI-lib
│   ├──assets
│   │   └───styles/
│   │         └───_theme.scss
│   │         └───_varialbes.scss
│   └──src
│       └───lib
│           └─modules
│              ├───autocomplete
│              │   └───components
│              │       └───auto-complete/
│              ├───checkbox
│              │   └───components
│              │       └───checkbox/

  ......................

 │       
 ├───App Test        
 ├───e2e/
 └───src
     ├───app         
          └───my-module

……………………..

my ng-package.json

{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "../../dist/ui-lib",
  "assets": [
    "./assets/"
  ],
  "lib": {
    "entryFile": "src/public-api.ts",
    "styleIncludePaths": [
      "./assets/styles/_theme.scss"
    ]
  },
  "whitelistedNonPeerDependencies": ["."]
}

The problem is that I am not able to import my _varialbe.scss file in my modules’ components.

Can you help me how can I import _variables.scss file in UI-lib/src/lib/modules/autcomplete/components/autocomplete/autocomplete.component.scss ?

I tried to search online but didn’t find the solution or worked.

Source: Angular Questions