#Angular Library Build - Could not resolve css

7 messages · Page 1 of 1 (latest)

halcyon mirage
#

Hello, i have made a Library with ui components and scss files. when i start do build it i get following:

Building entry point ...

  • Compiling with Angular sources in Ivy partial compilation mode.X [ERROR] Could not resolve "@angular/cdk/a11y-prebuilt.css"

    <stdin>:2:8:
    2 │ @import '@angular/cdk/a11y-prebuilt.css';
    ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    The path "./a11y-prebuilt.css" is not currently exported by package "@angular/cdk":

does anyone know, what i have to do, that the path will be resolved?

Thanks

burnt ether
#

Are you using ng-package ? About the public api , tsconfig and your imports look properly??

halcyon mirage
#

package.json: { "name": "lib", "version": "0.0.1", "license": "MIT", "private": false, "repository": { "type": "git", "url": "" }, "peerDependencies": { "@angular/cdk": "~17.1.0", "@angular/common": "~17.1.0", "@angular/core": "~17.1.0", "@angular/forms": "~17.1.0", "@angular/material": "~17.1.0", "@angular/material-moment-adapter": "~17.1.0", "@angular/platform-browser": "~17.1.0", "@angular/platform-browser-dynamic": "~17.1.0", "@angular/router": "~17.1.0", "moment": "^2.29.4", "moment-timezone": "^0.5.35", "autoprefixer": "^10.4.8", "postcss": "^8.4.16", "rxjs": "~7.8.0", "tailwindcss": "~3.4.1" }, "dependencies": { "tslib": "^2.3.0" }, "sideEffects": false }

#

ng-package.json: { "compilerOptions": { "outDir": "./dist/out-tsc/lib", "declaration": true, "declarationMap": true, "inlineSources": true, "types": [ "jest", "node" ] }, "include": [ "src/**/*.ts", "src/**/*.d.ts" ], "exclude": [ "node_modules", "src/**/*.spec.ts", "src/environments/environment.*.ts" ] }

#

content of my scss file:`
@import '@angular/cdk/a11y-prebuilt.css';
@import '@angular/cdk/overlay-prebuilt.css';

.blub {
z-index:100;
}`

#

Full error message:
`ng build lib --configuration production

Compiling with Angular sources in Ivy partial compilation mode.X [ERROR] Could not resolve "@angular/cdk/a11y-prebuilt.css"

<stdin>:2:8:                                                                                                             
  2 │ @import '@angular/cdk/a11y-prebuilt.css';                                                                          
    ╵         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The path "./a11y-prebuilt.css" is not currently exported by package "@angular/cdk":

node_modules/@angular/cdk/package.json:21:13:                                                                            
  21 │   "exports": {
     ╵              ^

None of the conditions in the package definition ("style") match any of the currently active
conditions ("browser", "default", "module"):

node_modules/@angular/cdk/package.json:29:27:
  29 │     "./a11y-prebuilt.css": {
     ╵                            ^

Consider enabling the "style" condition if this package expects it to be enabled. You can use
"conditions: ['style']" to do that:

node_modules/@angular/cdk/package.json:30:6:
  30 │       "style": "./a11y-prebuilt.css"
     ╵       ~~~~~~~

You can mark the path "@angular/cdk/a11y-prebuilt.css" as external to exclude it from the bundle,
which will remove this error and leave the unresolved path in the bundle.`

#

if i remove the imports the build works. But that is not the solution 😦