Use relative path in an Angular Library Component

[panagulis72]

I created a custom Library with Angular Cli. It has the following structure:

• dist
• projects
  • customLib
    • src
      • assets
        • icons
      • lib
        • button

The button component gets as Input() the name of the svg icon that will be displayed inside the button: this.svgIconUrl = '../../assets/icons/' +this.icon + '.svg';

I made a script which copy all icons (stored in src/assets/icons) and paste it inside dist folder. All this is working fine. Then, I published my library on bitbucket and I installed it in another Angular Application. The Library is imported correctly, but angular-svg-icon cannot find the svg because it is taking the svg in localhost:4200/#/assets/icons/myicon.svg

And of course it doesn't find the svg, because it is inside the library, so it is inside the "node_modules" folder. How can i force the button component of Library to take the svg inside the Library, so with a relative path?

[czeckd]

You will probably need to add some additional configuration in your angular.json. See: Angular Workspace Configuration/Assets configuration.

[KurienEapen]

I'm also going through a similar scenario. I came up on this suggestions, to modify angular.json :

"assets": ["src/favicon.ico", "src/assets", { "glob": "**/*", "input": "./node_modules/some-package/assets", "output": "/assets/" } ]

But I don't want to copy over the assets of my library to the parent application. Is there any other work around ?