CODEWITHSUNDEEP
cssangularsassangular-cli
Jędrek Markowski
Jędrek Markowski

Reputation: 444

@Import scss, relative path, angular-cli

I encountered some issues, by importing *.css file with @import into .scss. The .css file got some relative path url('path') inside and belongs to imported library, so is on node_modules.

My .component.scss looks like that:

@import "~libName/dist/icon";

And is imported by .component.ts, but it doesn't matter at all.

And node_modules/libName/dist/icon.css has code:

src: url("icons/SAP-icons.woff") format("woff");

On building it throws error that can't resolve files

(Emitted value instead of an instance of Error) CssSyntaxError:, because the icons/icon.woff which is in icon.css can't be found, becasue of wrong relative path.

angular v.7.3 with CLI.

Upvotes: 1

Views: 1740

Answers (1)

Bansi29
Bansi29

Reputation: 1079

You can use {} to reference the top level of the project path

@import "{}/node_modules/module-name/stylesheet";

Upvotes: 2

Related Questions